How to work on knockout validation localization - grails

I have a view page where i'm validating fields using knockout.js . I want to validate my fields in different country's language like spanish,french etc i.e using localization.
I have added el-GR.js ,fr-FR.js , ru-RU.js etc files into my js folder and referenced them.
Now how can i validate or check into my modalModal.js page?
modalModal.js
ko.validation.rules.pattern.message = 'Invalid.';
ko.validation.configure({
registerExtenders : true,
messagesOnModified : true,
insertMessages : true,
parseInputAttributes : true,
messageTemplate : null
});
var mustEqual = function (val, other) {
return val == other();
};
var modalViewModel= {
firstName : ko.observable().extend({
minLength : 2,
maxLength : 40
}),
lastName : ko.observable().extend({
minLength : 2,
maxLength : 10
}),
organisation : ko.observable().extend({
minLength : 2,
maxLength : 40
}),
email : ko.observable().extend({ // custom message
email: true
}),
password: ko.observable()
};
modalViewModel.confirmPassword = ko.observable().extend({
validation: { validator: mustEqual, message: 'Passwords do not match.', params:
modalViewModel.password }
});
modalViewModel.errors = ko.validation.group(modalViewModel);
// Activates knockout.js
ko.applyBindings(modalViewModel,document.getElementById('light'));

I've done this for my latest KO project
I override the KO validation rules and use the Globalize plugin, like
ko.validation.rules.number.validator = function (value, validate) {
return !String.hasValue(value) || (validate && !isNaN(Globalize.parseFloat(value)));
};
ko.validation.rules.date.validator = function (value, validate) {
return !String.hasValue(value) || (validate && Globalize.parseDate(value) != null);
};
edit: btw, there is a bug in the Globalize plugin, it will accept dot (.) as part of a number even if it isn't, i fixed that like this
Globalize.orgParaseFloat = Globalize.parseFloat;
Globalize.parseFloat = function (value) {
value = String(value);
var culture = this.findClosestCulture();
var seperatorFound = false;
for (var i in culture.numberFormat) {
if (culture.numberFormat[i] == ".") {
seperatorFound = true;
break;
}
}
if (!seperatorFound) {
value = value.replace(".", "NaN");
}
return this.orgParaseFloat(value);
};

Related

How to convert array to send as query string?

In my view, I have checkboxes and some data displayed and button on each row to approve or reject requests put up.
I want to send my integer array to my action method but this cannot be done by just sending it to action query parameters and it would be like the picture below:
public int[] Ids
{
get { return new int[] { 1, 2, 3 }; }
set {}
}
public ActionResult Approval([ModelBinder(typeof(IntArrayModelBinder))] int[] ids)
{
...
return View(...);
}
#Html.ActionLink("Approve", "Approval", new {id = item.Ids, approvalAction = "approve"})
How do I implement the checkboxes to be checked and hover of the approve/reject actionlink will show the url with ../ids=1&ids=2&ids=3 instead of System.Int32[]?
Option 1: Send your array as a comma-separated string and then split them in your action like this :
#Html.ActionLink("Approve", "Approval", new { id = string.Join("," , Ids), approvalAction = "approve" } )
your action :
public ActionResult YourAction(string id , string approvalAction)
{
var ids = id.Split(',');
//rest of your action method business
}
Option 2:
another way to achieve your exactly url is to create your URL like this :
var baseUrl = Url.Action("YourAction", "YourController", null, Request.Url.Scheme);
var uriBuilder = new UriBuilder(baseUrl);
uriBuilder.Query = string.Join("&", Ids.Select(x => "ids=" + x));
string url = uriBuilder.ToString();
url += "&approvalAction=approve"
and your action would be like this :
public ActionResult YourAction(int[] ids , string approvalAction)
{}
<script>
function multiSelect(selectedArray, action) {
if (selectedArray[0] === undefined) {
alert("You have not selected any employee");
}
//example url
//..?ids=1&ids=2&ids=3&aprovalAction=approve
else {
var param = "";
var currUrl = "";
var idUrl = "";
idUrl = "ids=" + selectedArray[0];
for (var i = 1; i < selectedArray.length; ++i) {
idUrl += "&ids=" + selectedArray[i];
}
switch (action) {
case "Approve":
param = "approve";
break;
case "Reject":
param = "reject";
break;
}
currUrl = "approvalAction=" + param;
window.location.href = "?" + idUrl + "&" + currUrl;
}
}
</script>
<script>
$('#MultiApproveBtn').click(function () {
var selected = $('input[type=checkbox]:checked').map(function (_, el) {
return $(el).val();
}).get();
var x = document.getElementById("MultiApproveBtn").value;
//alert(selected);
multiSelect(selected, x);
})
</script>
<script>
$('#MultiRejectBtn').click(function () {
var selected = $('input[type=checkbox]:checked').map(function (_, el) {
return $(el).val();
}).get();
var x = document.getElementById("MultiRejectBtn").value;
//alert(selected);
multiSelect(selected, x);
})
</script>

KendoValidation with Remote validation

This is almost killing me. I've never wasted so much time on an issue.
I've got a field that needs to be validated with a call to a REST API since it needs to check the presence of some data on the DB. The problem I've is that calling the validator.validate returns true even if the call to json api returns false.
Here's the code (I use the Kendo MVC helpers but it's not related to that the problem)
<div id="divValidator1">
<div class="form-group">
#Html.LabelFor(m => m.Email)
#(Html.Kendo().TextBoxFor(m => m.Email)
.HtmlAttributes(new { placeholder = "you#domain.com", type = "email", #class = "k-textbox required",data_bind="value: XXX" })
)
</div>
<footer class="col-xs-12 form-group text-right">
#(Html.Kendo().Button()
.Name("Next1")
.Content("Next")
.HtmlAttributes(new { #class = "k-primary", data_bind = "enabled: isEnabled" })
.Events(ev => ev.Click("onNextClick")))
</footer>
var kendoValid = $("#divValidator1").kendoValidator({
validateOnBlur: false,
rules: {
remote: function (input) {
if (input.val() == "" || !input.attr("data-val-remote-url")) {
return true;
}
if (input.attr("data-val-remote-recieved")) {
input.attr("data-val-remote-recieved", "");
return !(input.attr("data-val-remote"));
}
var url = input.attr("data-val-remote-url");
var postData = {};
postData[input.attr("data-val-remote-additionalfields").split(".")[1]] = input.val();
var validator = this;
var currentInput = input;
input.attr("data-val-remote-requested", true);
$.ajax({
url: url,
type: "POST",
data: JSON.stringify(postData),
dataType: "json",
traditional: true,
async:false,
contentType: "application/json; charset=utf-8",
success: function (data) {
if (data == true) {
input.attr("data-val-remote", "");
}
else {
input.attr("data-val-remote", false);
}
input.attr("data-val-remote-recieved", true);
// validator.validateInput(currentInput);
},
error: function () {
input.attr("data-val-remote-recieved", true);
validator.validateInput(currentInput);
}
});
return true;
}
},
messages: {
remote: function (input) {
return input.attr("data-val-remote");
}
}
}).data("kendoValidator");
var viewModel1 = kendo.observable({
XXX:null,
isEnabled: function () {
var self = this;
self.get("XXX");
var x = $("#divValidator1").data("kendoValidator");
console.log(x.validate());
}
});
kendo.bind($("#divValidator1"), viewModel1);
and here's the controller
public ActionResult IsEmailJustPresent(string email)
{
var res = email == "something";
return Json(res, JsonRequestBehavior.AllowGet);
}
And the ViewModel
public class RegisterViewModel
{
[Required]
[EmailAddress]
[Display(Name = "Email")]
[Remote("IsEmailJustPresent", "Home")]
public string Email { get; set; }
}
I've also used a kendo.observable so that I can enable/disable the next button based on the validation value.
In the isEnabled function you see I do var x = $("#divValidator1").data("kendoValidator"); but it returns always true (seems to only check for the required attribute).
To reach that solution I started from here
If you want there's a more complex example I've created on git that includes the wizard I'll need in my final project
Could this commented line be the problem?
// validator.validateInput(currentInput);
Is the attribute "data-val-remote" correctly set?

Passing String parameter Value Through angular Service parameter Value is Automatically Appends Some Special Character

Here's my Angular controller
//Save And Update
$scope.AddUpdateBusinessType = function() {
var businessType = {
Code: $scope.businessCode,
BusiType: $scope.businessType
};
var getBusinessTypeAction = $scope.BusinessTypeAction;
if (getBusinessTypeAction == "Update") {
businessType.BusinessTypeId = $scope.businessTypeId;
var getBusinessTypeData = businessTypeService.updateBusinessType(businessType);
getBusinessTypeData.then(function (msg) {
GetAllBusinessType();
$scope.ClearBusinessTypeForm();
alert("Record Updated Successful");
$scope.BusinessTypeAction = "";
$scope.divBusinessType = false;
}, function () {
alert('Error in Updating Record');
});
} else {
**// Save Section**
var getExistBusinessCode = businessTypeService.checkBusinessTypeCode(businessType.Code);
getExistBusinessCode.then(function (businessTypeCode) {
debugger;
if (businessTypeCode == true) {
alert('Business Type Code Already Exist');
} else {
debugger;
var getBusinessTypeData = businessTypeService.addBusinessType(businessType);
getBusinessTypeData.then(function (msg) {
GetAllBusinessType();
$scope.ClearBusinessTypeForm();
alert("Record Added Successful");
$scope.divBusinessType = false;
}, function () {
alert("Error Occured In Saving Data");
});
}
},function() {
alert('Error Occured While Checking Records');
});
}
}
In the above code Save Section I am trying to check if a value is exists in a database so I'm passing a string value to: checkBusinessTypeCode(businessType.Code) Service.When I Debug and See Value its Seems Normal.
Here's My Service:
//Check Business Code
this.checkBusinessTypeCode = function (businessTypeCode) {
debugger;
var response = $http({
method: "post",
url: "/BusinessType/CheckBusinessTypeDetailByCode",
params: {
businessTypeCode: JSON.stringify(businessTypeCode)
}
});
return response;
}
But when Passing To Controller string value I get some unexpected behavior.
two \\ always appear automatically
example
"\"stringvalue\""
I'm Still Having Above Problem
but as a quick solution i did code as follows
public bool _CheckBusinessTypeDetailByCode(string businessTypeCode)
{
string bisCode = businessTypeCode.Replace("\"", "");
bool isExist;
isExist = _IBusinessTypeRepository.IsExist(x => x.IsActive && !x.IsDelete && x.Code == bisCode);
return isExist;
}
I don't know is it bad practice or not , any way it is solved my problem.
Before did this modification
string businessTypeCode always gives value as
"\"somevalue\""

.Net RunTimeBinderException

I have a data content witch contains complex data I just need index names which seem in Dynamic View in data. In debug mode I can see the datas but cant get them..
You can see the contents of data in image below):
if(hits.Count() > 0)
{
var data = hits.FirstOrDefault().Source;
var dataaa = JsonConvert.DeserializeObject(hits.FirstOrDefault().Source);
}
I found a solution with checking if selected index has documents; if yes,
I take the first document in index, and parse it to keys(field names) in client.
here is my func:
[HttpPost]
public ActionResult getIndexFields(string index_name)
{
var node = new Uri("http://localhost:9200");
var settings = new ConnectionSettings(
node,
defaultIndex: index_name
);
var esclient = new ElasticClient(settings);
var Documents = esclient.Search<dynamic>(s => s.Index(index_name).AllTypes().Source());
string fields = "";
if (Documents.Documents.Count() > 0)
{
fields = JsonConvert.SerializeObject(Documents.Documents.FirstOrDefault());
var data = Documents.Documents.FirstOrDefault().Source;
return Json(new
{
result = fields,
Success = true
});
}
return Json(new
{
result = "",
Success = false
});
}
and my js:
$.ajax({
url: "getIndexFields?index_name=" + $(this).val(),
type: "POST",
success: function (data) {
if (data.Success) {
var fields = JSON.parse(data.result);
var fields_arr = [];
$.each(fields, function (value, index) {
fields_arr.push(
{
id: value,
label: value
})
});
options.filters = fields_arr;
var lang = "en";//$(this).val();
var done = function () {
var rules = $b.queryBuilder('getRules');
if (!$.isEmptyObject(rules)) {
options.rules = rules;
}
options.lang_code = lang;
$b.queryBuilder('destroy');
$('#builder').queryBuilder(options);
};
debugger
if ($.fn.queryBuilder.regional[lang] === undefined) {
$.getScript('../dist/i18n/query-builder.' + lang + '.js', done);
}
else {
done();
}
}
else {
event.theme = 'ruby';
event.heading = '<i class=\'fa fa-warning\'></i> Process Failure';
event.message = 'User could not create.';
event.sticky = true;
$("#divfailed").empty();
$("#divfailed").hide();
$("#divfailed").append("<i class='fa fa-warning'></i> " + data.ErrorMessage);
$("#divfailed").show(500);
setTimeout(function () {
$("#divfailed").hide(500);
}, 3000);
}
},
error: function (a, b, c) {
debugger
event.theme = 'ruby';
event.heading = '<i class=\'fa fa-warning\'></i> Process Failure';
event.message = 'Object could not create.';
$("#divfailed").empty();
$("#divfailed").hide();
msg = c !== "" ? c : a.responseText;
$("#divfailed").append("<i class='fa fa-warning'></i> " + msg);
$("#divfailed").show(500);
setTimeout(function () {
$("#divfailed").hide(500);
}, 3000);
}
});

Can't acces the ValidationParameters on .NET MVC client-side validation

I am coding a custom validation to my .NET MVC 4 application. This is the first validation that uses a parameter, and I'm finding some trouble to get this.
This is my C# code:
ValidationAttribute:
namespace Validations
{
[AttributeUsage(AttributeTargets.Field | AttributeTargets.Property, AllowMultiple = false, Inherited = true)]
public class MinRequiredPasswordLengthValidationAttribute : ValidationAttribute, IClientValidatable
{
public MinRequiredPasswordLengthValidationAttribute()
: base("The password is invalid")
{
}
public override string FormatErrorMessage(string name)
{
return String.Format(CultureInfo.CurrentCulture, ErrorMessageString, name.ToLower(), Membership.MinRequiredPasswordLength);
}
public override bool IsValid(object value)
{
if (value == null || String.IsNullOrEmpty(value.ToString()))
{
return true;
}
return value.ToString().Length >= Membership.MinRequiredPasswordLength;
}
public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
{
ModelClientMinRequiredPasswordLengthValidationRule rule = new ModelClientMinRequiredPasswordLengthValidationRule(FormatErrorMessage(metadata.GetDisplayName()), Membership.MinRequiredPasswordLength);
yield return rule;
}
}
}
ModelClientValidationRule:
namespace Validations
{
public class ModelClientMinRequiredPasswordLengthValidationRule : ModelClientValidationRule
{
public ModelClientMinRequiredPasswordLengthValidationRule(string errorMessage, int minRequiredPasswordLength)
{
ErrorMessage = errorMessage;
ValidationType = "minrequiredpasswordlength";
ValidationParameters.Add("minlength", minRequiredPasswordLength);
}
}
}
And here is the JS code, my problem:
jQuery.validator.addMethod("minrequiredpasswordlength", function (value, element, params) {
if (value.length == 0) {
return true; //empty
}
return true; //dummy return
}, "");
jQuery.validator.unobtrusive.adapters.add("minrequiredpasswordlength", {}, function (options) {
//XXX Here I should get the minlength parameter, but 'options' is a empty object
options.messages["minrequiredpasswordlength"] = options.message;
});
Many thanks for the help!
see if this link helps:
ASP.NET MVC 3 client-side validation with parameters
Also, try changing your javascript code to this:
$.validator.addMethod('minrequiredpasswordlength', function (value, element, params) {
var minLength = params.minLength;
// minLength should contain your value.
return true; // dummy return
});
jQuery.validator.unobtrusive.adapters.add('minrequiredpasswordlength', [ 'minlength' ], function (options) {
options.rules['minrequiredpasswordlength'] = {
minLength: options.params['minlength']
};
//XXX Here I should get the minlength parameter, but 'options' is a empty object
options.messages["minrequiredpasswordlength"] = options.message;
});
The secret here is to use [ 'minlength' ] instead of {} It took me a lot of time when I first learnt this. I hope this helps.

Resources