Angular form validation in IE - validation

I'm trying to get Angular form validation working in ie8. Here is my code:
<form id="contact-form" name="cform" target="_blank" >
<div class="left">
<div>
<div class="group">
<label for="firstname">First Name <span class="asterisk">*</span></label><br />
<input type="text" name="firstname" id="firstname" data-ng-model="firstname" required />
<span class="error" data-ng-show="cform.input.$error.required">Required!</span>
</div>
<div class="group">
<label for="lastname">Last Name <span class="asterisk">*</span></label><br />
<input type="text" name="lastname" id="lastname" data-ng-model="lastname" required />
<span class="error" data-ng-show="cform.input.$error.required">Required!</span>
</div>
</div>
<div>
<div class="group">
<label for="email">Email Address <span class="asterisk">*</span></label><br />
<input type="email" id="email" name="email" data-ng-model="email" required />
<span class="error" data-ng-show="cform.email.$error.email">Required!</span>
</div>
</div>
<div>
<div class="group">
<label for="phone">Primary Phone Number <span class="asterisk">*</span></label><br />
<input type="text" name="phone" id="phone" data-ng-model="phone" required />
<span class="error" data-ng-show="cform.input.$error.required">Required!</span>
</div>
<div class="group">
<label for="-secondary-phone">Secondary Phone Number</label><br />
<input type="text" name="secondary-phone" id="secondary-phone" />
</div>
</div>
</div>
<div class="right">
<div class="group">
<label for="message">Your Message</label><br />
<textarea id="message"></textarea>
</div><br />
<input type="submit" value="SEND MESSAGE" class="button">
</div>
</form>
This works in Firefox and Chrome, but in IE8 no validation errors are triggered. Anyone know what the issue might be?
Thanks.
UPDATE: This seems to be a problem in all versions of IE. {{cform.input.$error}} and {{cform.input}} don't show output in any browser.

<div class="group">
<label for="firstname">First Name <span class="asterisk">*</span></label><br />
<input type="text" name="firstname" id="firstname" data-ng-model="firstname" ng-required="true" />
<span class="error" data-ng-show="cform.firstname.$error.required && cform.firstname.$dirty">Required!</span>
</div>

Ie 8 does not support html 5 ,Angular is using html 5 , Do the work around to get angular working on IE and then use the pattern because you cant use the html 5 element

Related

Controller function not getting called on form submit

I have created an form for submission and written a controller method to handle it in spring MVC. But the request is not reaching the controller method.Please let me know what mistake i'm making in writing the controller/form method.
Below is my code snippet which is self explanatory.
Controller method:
#RequestMapping(value="/users/login/projectUpdate",method=RequestMethod.POST)
public String updateProjectStatus( User user,Model model,Authentication
authentication,HttpServletRequest request,final RedirectAttributes
redirectAttributes) {
logger.debug("Update Project Status Data()");
String projectname=request.getParameter("projectName");
String projectStatus=request.getParameter("projectStatus");
String projectStatusDate=request.getParameter("projectStatusDate");
userService.updateProject(projectStatus,projectStatusDate,projectname);
return "users/updateProject";
}
JSP form:
<spring:url value="/users/login/projectUpdate" var="updateProjectUrl" />
<form:form method="post" modelAttribute="updateProjectForm"
action="${updateProjectUrl}" id="ProjectForm">
<label class="col-sm-2 control-label">Projects</label>
<div class="col-sm-9">
<form:select path="project" multiple="false" class="form-control" id="project1">
<form:option label="--Select--" value=""/>
<form:options items="${project}" />
</form:select>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Project Description</label>
<div class="col-sm-9">
<form:input path="projectDescription" type="text" class="form-control" id="projectDescription1" placeholder="Project Description" readonly="true"/>
</div>
</div>
<div class="form-group ${status.error ? 'has-error' : ''}">
<label class="col-sm-2 control-label">Project Start Date</label>
<div class="col-sm-9">
<form:input path="projectStartDate" type="text" class="form-control" id="projectStartDate1" placeholder="Project Start Date" readonly="true" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Current Status</label>
<div class="col-sm-9">
<form:input path="projectCurrentStatus" type="text" class="form-control" id="projectCurrentStatus" placeholder="Project Status" readonly="true"/>
</div>
</div>
<div class="form-group ${status.error ? 'has-error' : ''}">
<label class="col-sm-2 control-label">Current Status Date</label>
<div class="col-sm-9">
<form:input path="projectCurrentStatusDate" type="text" class="form-control " id="projectCurrentStatusDate" placeholder="Project Current Status Date" readonly="true"/>
</div>
</div>
<label class="col-sm-2 control-label">New Status</label>
<div class="col-sm-9">
<form:select path="projectStatus" multiple="false" class="form-control" id="projectStatus1" >
<form:option label="--Select--" value=""/>
<form:options items="${projectstatus}" />
</form:select>
</div>
<label class="col-sm-2 control-label">New Status Date</label>
<div class="col-sm-9">
<form:input path="projectStatusDate" type="date" class="form-control " id="projectStatusDate1" placeholder="Project Status Date" data-validation="date" data-validation-format="yyyy-mm-dd" />
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Project Team Members</label>
<div class="col-sm-9">
<form:input path="projectTeam" type="text" class="form-control " id="projectTeam1" placeholder="Project Team members" />
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-5 col-sm-7">
<button type="submit" class="btn btn-success">Update</button>
</div>
</div>
Please try using BindingResult like below :
public String updateProjectStatus( User user,BindingResult bindingResult,Model model,Authentication authentication,HttpServletRequest request,final RedirectAttributes redirectAttributes){
if (bindingResult.hasErrors()) {
//check your errors here
}
}
and make sure all the fields which you are passing from JSP should be present in your User class.

PrestaShop: Change order of two fields in registration form

I know this is not a Prestashop forum but I don't doubt that you have the solution I am looking for.
I want to change the order of two fields in the registration form in Prestashop 1.6. I also wanted to hide some unnecessary ones but that I have managed to do myself.
The field I want to move is the VAT field (moms in Swedish) as I have painted on the attached picture:
Because this field only is visible when the Company field is filled in I did not dare to touch it.
The field you can see on this image
MOMS field should go before web address field
The code I think is to be changed come here
<h3 class="page-subheading">{l s='Your company information'} </h3>
<p class="form-group">
<label for="">{l s='Company'}</label>
<input type="text" class="form-control" id="company" name="company" value="{if isset($smarty.post.company)}{$smarty.post.company} {/if}" />
</p>
<p class="form-group">
<label for="website">{l s='Website'}</label>
<input type="text" class="form-control" id="website" name="website" value="{if isset($smarty.post.website)}{$smarty.post.website} {/if}" />
</p>
</div>
{/if}
{if isset($PS_REGISTRATION_PROCESS_TYPE) && $PS_REGISTRATION_PROCESS_TYPE}
<div class="account_creation">
<h3 class="page-subheading">{l s='Your address'}</h3>
{foreach from=$dlv_all_fields item=field_name}
{if $field_name eq "company"}
{if !$b2b_enable}
<p class="form-group">
<label for="company">{l s='Company'}{if in_array($field_name, $required_fields)} <sup>*</sup>{/if}</label>
<input type="text" class="form-control" id="company" name="company" value="{if isset($smarty.post.company)} {$smarty.post.company}{/if}" />
</p>
{/if}
{elseif $field_name eq "vat_number"}
<div id="vat_number" style="display:none;">
<p class="form-group">
<label for="vat_number">{l s='VAT number'}{if in_array($field_name, $required_fields)} <sup>*</sup>{/if}</label>
<input type="text" class="form-control" id="vat_number" name="vat_number" value="{if isset($smarty.post.vat_number)} {$smarty.post.vat_number}{/if}" />
</p>
</div>
{elseif $field_name eq "firstname"}
<p class="required form-group">
<input type="hidden" class="form-control" id="firstname" name="firstname" value="{if isset($smarty.post.firstname)} {$smarty.post.firstname}{/if}" />
</p>
{elseif $field_name eq "lastname"}
<p class="required form-group">
<input type="hidden" class="form-control" id="lastname" name="lastname" value="{if isset($smarty.post.lastname)} {$smarty.post.lastname}{/if}" />
</p>
You have to move this field to the upper section:
<h3 class="page-subheading">{l s='Your company information'} </h3>
<p class="form-group">
<label for="">{l s='Company'}</label>
<input type="text" class="form-control" id="company" name="company" value="{if isset($smarty.post.company)}{$smarty.post.company} {/if}" />
</p>
<p class="form-group">
<label for="website">{l s='Website'}</label>
<input type="text" class="form-control" id="website" name="website" value="{if isset($smarty.post.website)}{$smarty.post.website} {/if}" />
</p>
{foreach from=$dlv_all_fields item=field_name}
{if $field_name eq "vat_number"}
<div id="vat_number" style="display:none;">
<p class="form-group">
<label for="vat_number">{l s='VAT number'}{if in_array($field_name, $required_fields)} <sup>*</sup>{/if}</label>
<input type="text" class="form-control" id="vat_number" name="vat_number" value="{if isset($smarty.post.vat_number)} {$smarty.post.vat_number}{/if}" />
</p>
</div>
{/if}
{/foreach}
</div>
{/if}
{if isset($PS_REGISTRATION_PROCESS_TYPE) && $PS_REGISTRATION_PROCESS_TYPE}
<div class="account_creation">
<h3 class="page-subheading">{l s='Your address'}</h3>
{foreach from=$dlv_all_fields item=field_name}
{if $field_name eq "company"}
{if !$b2b_enable}
<p class="form-group">
<label for="company">{l s='Company'}{if in_array($field_name, $required_fields)} <sup>*</sup>{/if}</label>
<input type="text" class="form-control" id="company" name="company" value="{if isset($smarty.post.company)} {$smarty.post.company}{/if}" />
</p>
{/if}
{elseif $field_name eq "firstname"}
<p class="required form-group">
<input type="hidden" class="form-control" id="firstname" name="firstname" value="{if isset($smarty.post.firstname)} {$smarty.post.firstname}{/if}" />
</p>
{elseif $field_name eq "lastname"}
<p class="required form-group">
<input type="hidden" class="form-control" id="lastname" name="lastname" value="{if isset($smarty.post.lastname)} {$smarty.post.lastname}{/if}" />
</p>

how to use multiple hidden fields with the same name

hi i'm trying to get the rate for a product i tried this :
<div class="pro-rate">
<span class="fa fa-star" data-rate="1" ><input type="hidden" name="evaluation" id="1" value="1"></span>
<span class="fa fa-star" data-rate="2" ><input type="hidden" name="evaluation" id="2" value="2"></span>
<span class="fa fa-star" data-rate="3" ><input type="hidden" name="evaluation" id="3" value="3"></span>
<span class="fa fa-star" data-rate="4" ><input type="hidden" name="evaluation" id="4" value="4"></span>
<span class="fa fa-star" data-rate="5" ><input type="hidden" name="evaluation" id="5" value="5"></span>
but it keeps give me only the value of 5 nothing else , how can i get each value as i want not only the last one ?
and here is the full form :
<form class="form-horizontal" action="{{action('onlyController#postIndex')}}" method="POST">
{!! csrf_field() !!}
#foreach($product as $pro)
<input type="hidden" name="product_id" value="{{$pro->id}}" />
<div class="form-group">
<label for="inputName" class="col-sm-2 control-label">الاسم </label>
<div class="col-sm-10">
<input type="text" class="form-control" name="username" id="inputName" placeholder="الاسم " required>
</div>
</div>
<div class="form-group">
<label for="inputEmail" class="col-sm-2 control-label">الاميل </label>
<div class="col-sm-10">
<input type="email" class="form-control" name="email" id="inputEmail" placeholder="الاميل" required>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">نص التعليق </label>
<div class="col-sm-10">
<textarea class="form-control" rows="5" name="comment" maxlength="1000" required></textarea>
</div>
</div>
<div class="reviews">
<ul>
<li>
<label class="col-sm-2 control-label">التقييم </label>
<span>ردئ</span>
<div class="pro-rate">
<span class="fa fa-star" data-rate="1" ><input type="hidden" name="evaluation[]" id="1" value="1"></span>
<span class="fa fa-star" data-rate="2" ><input type="hidden" name="evaluation[]" id="2" value="2"></span>
<span class="fa fa-star" data-rate="3" ><input type="hidden" name="evaluation[]" id="3" value="3"></span>
<span class="fa fa-star" data-rate="4" ><input type="hidden" name="evaluation[]" id="4" value="4"></span>
<span class="fa fa-star" data-rate="5" ><input type="hidden" name="evaluation[]" id="5" value="5"></span>
</div>
<span>ممتاز</span>
</li>
</ul>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn ">ارسال </button>
</div>
</div>
#endforeach
</form>
how can i do it ?
use 'evaluation[]'
but evaluation will be an array on server
<div class="pro-rate">
<span class="fa fa-star" data-rate="1" ><input type="hidden" name="evaluation[]" id="1" value="1"></span>
<span class="fa fa-star" data-rate="2" ><input type="hidden" name="evaluation[]" id="2" value="2"></span>
<span class="fa fa-star" data-rate="3" ><input type="hidden" name="evaluation[]" id="3" value="3"></span>
<span class="fa fa-star" data-rate="4" ><input type="hidden" name="evaluation[]" id="4" value="4"></span>
<span class="fa fa-star" data-rate="5" ><input type="hidden" name="evaluation[]" id="5" value="5"></span>
$_POST['evaluation'] is going to be an array
$evaluation = $_POST['evaluation'];
foreach($evaluation as $val){
//do something with the values here
}
ok, well all seems to be working for me
<?php
if($_POST)
print_r($_POST['email']);
?>
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
Name: <input type="text" name="name"><br>
E-mail: <input type="text" name="email"><br>
hidden <input type="hidden" name="email[]" value='hjdfkhds' ><br>
hidden: <input type="hidden" name="email[]" value='iufd'><br>
hidden: <input type="hidden" name="email[]" value='78642di'><br>
hidden <input type="hidden" name="email[]" value='uidynsx' ><br>
hidden <input type="hidden" name="email[]" value='qsqaaa'><br>
<input type="submit">
</form>
after I clicked submit. This is what I got

use the hidden form value in virtuemart joomla

i want to use the hidden form value "virtuemart_product_price" a administrator\components\com_virtuemart\helpers\calculationh.php
this form is added in components\com_virtuemart\views\cart\tmpl\default.php ..
<form method="post" class="product js-recalculate" action="/ecomm/index.php/component/virtuemart/">
<div class="addtocart-bar">
<!-- <label for="quantity229" class="quantity_box">Quantity: </label> -->
<span class="quantity-box">
<input type="hidden" class="quantity-input js-recalculate" name="quantity[]" value="1"/>
</span>
<span class="addtocart-button">
<input type="submit" name="addtocart" class="addtocart-button" value="Pick free" title="Pick free" /> </span>
<div class="clear"></div>
</div>
<input type="hidden" name="virtuemart_product_price" value="5" />
<input type="hidden" class="pname" value="Custom Item"/>
<input type="hidden" name="option" value="com_virtuemart"/>
<input type="hidden" name="view" value="cart"/>
<noscript><input type="hidden" name="task" value="add"/></noscript>
<input type="hidden" name="virtuemart_product_id[]" value="<?php echo virtuemart_product_id;?>"/>
</form>
i tried to get but i can't find a solution.

Tree structure with Check boxes in JQuery Mobile

Is it possible to have a tree structure with check boxes in JQuery MObile. I did not find any thing in demos.
I wanted something similar this image: Is there any alternative way we can achieve this?
Well it's just a concept but I have a couple working examples:
http://jsfiddle.net/JYn53/2/
http://jsfiddle.net/JYn53/4/
HTML
<div data-role="page">
<div data-role="content">
<div data-role="collapsible" data-collapsed="true">
<h3>
<input type="checkbox" name="checkbox-1a" id="checkbox-1a" class="custom" />
<label for="checkbox-1a">Cheetos</label>
</h3>
<p>
<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<legend>Choose as many snacks as you'd like:</legend>
<input type="checkbox" name="checkbox-1aa" id="checkbox-1aa" class="custom" />
<label for="checkbox-1aa">Cheetos</label>
<input type="checkbox" name="checkbox-2aa" id="checkbox-2aa" class="custom" />
<label for="checkbox-2aa">Doritos</label>
<input type="checkbox" name="checkbox-3aa" id="checkbox-3aa" class="custom" />
<label for="checkbox-3aa">Fritos</label>
<input type="checkbox" name="checkbox-4aa" id="checkbox-4aa" class="custom" />
<label for="checkbox-4aa">Sun Chips</label>
</fieldset>
</div>
</p>
</div>
</div>
</div>

Resources