I have added a checkbox list in a loop with iCheck. The html is as follows for checkboxes.
<input class="iCheck out-check" type="checkbox"
data-parsley-mincheck="1"
data-parsley-multiple="promo-outs"
data-parsley-group="outs"
data-parsley-error-message="You need to check something."
data-parsley-required = "true"
data-parsley-trigger="change"
data-parsley-errors-container='div[id="outerror"]'
id="outs" name="outs"
value="1" />
And I have a div with the id of "outerror". When I do the validation it fails when no checkbox was checked and works as expected but it does not show the message.
Related
I am using CFWheels for form validation. I have presenseOf() validation checks in both objects models. I have a form with a textbox and a set of radio buttons.
However If I submit the form empty, the validation for supervisor works but validation for the user checklist does not work. It gives the error;
"uchecklist" is not defined in the params variable.
On further observation, I notice that when the form is submitted, params struct has the "supervisor[name]" object but its empty, however it doesn't even have the "uchecklist[cstatus]" object. Moreover only when I select one of the radio buttons then the "uchecklist[cstatus]" object is submitted with that radio button's value.
I need to validate if at least one of the radio button is select, I guest this functionality is different from the empty text box validation.
Can someone show me how a radio button is validated using CFWheels form helpers.
Controller
public function t_validate()
{
title = "Home";
supervisor = model("supervisors");
uchecklist = model("user_checklist");
}
public function t_validate_complete()
{
title = "Home";
supervisor = model("supervisors").new(params.supervisor);
supervisor.save();
uchecklist = model("user_checklist").new(params.uchecklist);
uchecklist.save();
renderPage(action="t_validate");
}
View
<cfoutput>
<cfdump var="#params#">
#errorMessagesFor("supervisor")#
#startFormTag(action="t_validate_complete")#
<div>
<label for="">Supervisor:</label>
<input name="supervisor[name]" value="" />
</div>
<fieldset>
<input type="radio" name="uchecklist[cstatus]" value="1" />
<label for="profile-eyeColorId-2">Blue</label><br />
<input type="radio" name="uchecklist[cstatus]" value="2" />
<label for="profile-eyeColorId-1">Brown</label><br />
<input type="radio" name="uchecklist[cstatus]" value="3" />
<label for="profile-eyeColorId-3">Hazel</label><br />
</fieldset>
<div>
<input type="submit" value="Save Changes" />
</div>
#endFormTag()#
</cfoutput>
An unchecked radio button will submit no data to the server. This isn't a unique problem to ColdFusion or CFWheels.
To fix, provide a default value for the struct at the beginning of your controller action:
public function t_validate_complete()
{
// Provides an empty struct for the model to consume if none of the radio buttons are checked.
param name="params.uchecklist" type="struct" default="#StructNew()#";
title = "Home";
supervisor = model("supervisors").new(params.supervisor);
supervisor.save();
uchecklist = model("user_checklist").new(params.uchecklist);
uchecklist.save();
renderPage(action="t_validate");
}
I'd like to validate a form with ajax where there is a checkbox field.
I tried in this way but I can't get the value of checkbox field.
MY FORM
<form class="Form" action="?">
<input type="text" name="type" id="type" />
<input type="text" name="action" id="action" />
<input type="checkbox" name="chk" id="chk" value="1">
<input type="submit" value="INSERT" />
</form>
MY AJAX
$(".Form").submit(function( event ) {
event.preventDefault();
$.post("control.php", {
type: $("#type").val(),
action: $("#action").val(),
chk: $("#chk").val()
},
function(data){
$("#msg").html(data);
}
});
CONTROL.PHP
// CHECKBOX VALUE
if($_POST["chk"] == 1){
echo "THE VALUE IS 1";
exit;
}
How I could Do this? Thanks
EDIT
I tried pass to control page the chk with no success
$.post("control.php", {
type: $("#type").val(),
action: $("#action").val(),
chk: $("#chk").prop('checked')
},
and
$.post("control.php", {
type: $("#type").val(),
action: $("#action").val(),
$("#chk").prop('checked')
},
How can I define the name of my checkbox field in ajax post? thanks
This returns true if the checkbox is checked:
$("#chk").prop('checked')
And in PHP check it like this:
if(isset($_POST["chk"])) // true
For check boxes, php passing value if only check box selected. so you can check is that check box received to PHP page. if its received user has selected it or if user not selected, no check box name passing to PHP page.
so you can check
if(isset($_POST["chk"]))
...
if this returns true, that means user selected check box and if not user not selected...
One solution is you send a zero value with the same name in a hidden input
<input type="hidden" name="chk" value="0">
<input type="checkbox" name="chk" id="chk" value="1">
and if chk is checked the hidden input chk will be overriden in the $_POST
I'm trying to validate that a radio button has been selected via server side in ColdFusion. The text input errors out if empty, however, the radio button group does not trigger an error if none are selected. I cannot seem to find any documentation on this.
<cfform name="mobile_device_request" id="form" action="">
Text Box:
<cfinput type="Text" name="subscriber" message="Please enter in a subscriber" required="yes" validateat="onserver">
Subscriber:
<cfinput type="Radio" name="service_provider" value="AT&T" required="yes" validateat="onserver"><span class="label">AT&T</span>
<cfinput type="Radio" name="service_provider" value="Sprint" required="yes" validateat="onserver"><span class="label">Sprint</span>
<cfinput type="Radio" name="service_provider" value="Verizon" required="yes" validateat="onserver"><span class="label">Verizon</span>
Explanation:
To answer your question, while I have never used that feature, I would say it is a bug.
According to the documentation onServer validation works by automatically appending hidden form fields with a special naming convention. The CF server then inspects all requests for certain patterns in form field names, such as ones ending in _required or _cfformrequired, and if found performs validation on the related field.
If you view the source of your cfform, notice CF has added several hidden fields:
<input type='hidden' name='subscriber_CFFORMREQUIRED' value='Please enter in a subscriber'>
<input type='hidden' name='service_provider_CFFORMREQUIRED' value='Error in service_provider text.'>
<input type='hidden' name='service_provider_CFFORMREQUIRED' value='Error in service_provider text.'>
<input type='hidden' name='service_provider_CFFORMREQUIRED' value='Error in service_provider text.'>
Those should trigger CF's server side validation for both fields. However, as you discovered it only works with the text field, not the radio buttons. Though curiously, it works just fine if you manually add a hidden field ending in _required:
<input type="hidden" name="service_provider_required"
value='You forgot to select a service_provider'>
Answer:
Again, I think the behavior you are seeing may be a bug. Frankly, one of many with cfform. Personally, I would recommend ditching cfform/cfinput. Use plain html inputs and write your own validation instead. Since it is a radio button, the field will only be defined if one of the buttons was checked. So you can either test for the existence of the field:
<cfif NOT structKeyExists(FORM, "service_provider")>
no service_provider selected. do something
</cfif>
... OR assign a default, and test for that value:
<!--- default to empty string --->
<cfparam name="FORM.service_provider" default="">
<cfif NOT len(FORM.service_provider)>
no service_provider selected. do something
</cfif>
I have this simple kendo-template script:
<!-- popup editor template -->
<script id="userEditor" type="text/x-kendo-template">
<div id="popServerErrorSummaryPlaceholder" style="display:none"></div>
<div class="control-row">
<label class="span2" for="FirstName">Vorname</label>
<input Id="FirstName" class="span4" data-bind="value:FirstName" maxlength="50" name="FirstName" required="true" type="text" />
<span class="k-invalid-msg" data-for="FirstName"></span>
</div>
<div class="control-row">
<label class="span2" for="LastName">Nachname</label>
<input Id="LastName" class="span4" data-bind="value:LastName" maxlength="50" name="LastName" required="true" type="text" />
<span class="k-invalid-msg" data-for="LastName"></span>
</div>
</script>
Which is used while editing a single row within the Kend-UI grid.
I have got right now two issues:
a) The documentation states that I can control the position for validation messages via a "span" element that has a class "k-invalid-msg".
The behaviour right now is that this span Element gets replaced with a div element and it is positioned below the label element. I would like to get the message next to the input.
b) The validation is triggered immediately when the pop up is displayed.The validation should be trigger either when leaving the input or clicking the "update" button.
Someone out there who can help me here?
Things I am not quite sure how to handle:
c) Some validations are performed at the server. I get them back to the browser via the DataSource error event (custom JSON which is basically a list of field name and associated error messages). I would like to display the error messages within the validation span. I can create custom validation rules as documented here.
How do I get the validator that is associated with the pop up editor window? Or is there foreach input a validator created?
Anyone did this before?
Thanks for any help!
Updates:
regarding to point a)
OnaBai pointed me to the right direction. Thanks for that.
This is what I did on the view. I put #Html.CheckBox("checkBox", false, "Name") in a jQuery UI tab.
But on the rendered html, this checkbox control was evaluated as a html string
<input id="checkBox" name="checkBox" type="checkbox" value="true" /><input name="checkBox" type="hidden" value="false" /><label for="checkBox">Name</label>
rather than a control. Any idea?
The default for Html.CheckBox also creates a hidden input tag.
This will return the value you get when the checkbox is not checked. Due to the nature of html, if a checkbox is not checked, nothing will be posted. So this is the easiest workaround.