Form validation using jQuery and Ajax in PHP

I have a form which has education div with course, year of completion, university and percent fields, and I am validating those education div fields using Ajax in PHP, and thats working perfectly, but when I clone education div and then if there is any validation error in second (cloned education) div then it reflect it in first (education field).

this is the form: Educational Details

<!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="courses">Course Type</label> <div class="col-md-6"> <select class="form-control" name="course[]" id="course1[]" onblur="validate('course', this.value)"> <option value="0">--Select--</option> <option value="FullTime">FullTime</option> <option value="PartTime">PartTime</option> <option value="Distance Education">Distance Education</option> <option value="Executive">Executive</option> </select> </div> </div> <div id="course" class="text-center course"></div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="year">Year of Completion</label> <div class="col-md-6"> <select class="form-control" name="year[]" id="year1[]" onblur="validate('year', this.value)"> <?php require('layout/educompletionyear.php'); ?> </select> </div> </div> <div id="year" class="text-center"></div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 label_usity control-label" for="university">University/Institute</label> <div class="col-md-6"> <select class="form-control" name="university[]" id="university1[]" onblur="validate('university', this.value)"> <?php require('layout/institute.php'); ?> </select> </div> </div> <div id="university" class="text-center"></div> </fieldset> </div> <div class="col-md-6"> <fieldset> <!-- Text input--> <div class="form-group"> <label class="col-md-4 label_degree control-label" for="degree">Degree</label> <div class="col-md-6"> <select class="form-control" name="degree[]" id="degree1[]" onblur="validate('degree', this.value)"> <?php require('layout/degree.php'); ?> </select> </div> </div> <div id="degree" class="text-center"></div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 label_Grade control-label" for="grade">Grade</label> <div class="col-md-6"> <select class="form-control" name="grade[]" id="grade1[]" onblur="validate('grade', this.value)" > <option value="-1">--Select--</option> <option value="A">A</option> <option value="A+">A+</option> <option value="B">B</option> <option value="B+">B+</option> <option value="C">C</option> <option value="C+">C+</option> <option value="D">D</option> <option value="D+">D+</option> <option value="E">E</option> <option value="E+">E+</option> <option value="F">F</option> <option value="F+">F+</option> </select> </div> </div> <div id="grade" class="text-center"></div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="percentage">Percentage</label> <div class="col-md-6"> <input id="percentage1[]" name="percentage[]" onblur="validate('percentage', this.value)" type="text" placeholder="Percentage" class="input_percentage form-control input-md"> </div> </div> <div id="percentage[]" class="text-center"></div> </fieldset> </div> <a class="close" data-dismiss="alert" style="padding-right: 37px;opacity: 1;"><button type="button" class="addbtn btn btn-danger">Remove</button></a> </div>

this is the ajax validation:

<?php $value = $_GET['query']; $formfield = $_GET['field']; //EDUCATION PART // Check Valid or Invalid Course type when user enters Course in select option input field. if ($formfield == "course") { if ($value =="0") { echo "Please select Prefered location."; }else{ } } // Check Valid or Invalid year when user enters Year of completion in select option input field. if ($formfield == "year") { if ($value =="-1") { echo "Please select Year of completion."; }else{ } } // Check Valid or Invalid University type when user enters University in select option input field. if ($formfield == "university") { if ($value =="-1") { echo "Please select University."; }else{ } } // Check Valid or Invalid Degree when user enters Degree in select option input field. if ($formfield == "degree") { if ($value =="-1") { echo "Please select Degree."; }else{ } } // Check Valid or Invalid Grade when user enters Grade in select option input field. if ($formfield == "grade") { if ($value =="-1") { echo "Please select Grades."; }else{ } } // Check Valid or Invalid Persentage when user enters Persentage in lastname input field. if ($formfield == "percentage") { if (strlen($value) ==0) { echo "Please enter your Persentage."; }elseif (!preg_match("/^((0|[1-9]\d?)(\.\d{1,2})?|100(\.00?)?)$/",$value)) { echo "Only enter valid persentage"; }else { } } ?>

Please help to resolve cloned div validation messages part.

-------------Problems Reply------------

Use Jquery validate built-in library to validate forms very easily.

I got the way of implementing this....

i am creating an array of error message showing div and then i am also creating one more array for input fields attribut onblur

<div id="percentage[1]" class="text-center percentage"></div>

onblur="validate('percentage[1]', this.value)"

using jquery.

$('#btnAdd').click(function () {
var num = $('.clonedInput').length, // Checks to see how many "duplicatable" input fields we currently have
newNum = new Number(num + 1), // The numeric ID of the new input field being added, increasing by 1 each time
newElem = $('#entry1').clone().attr('id', 'entry' + newNum).fadeIn('slow'); // create the new element via clone(), and manipulate it's ID using newNum value

newElem.find('.percentage').attr('id', 'percentage[' + newNum + ']');

newElem.find('.input_percentage').attr('onblur', 'validate("percentage[' + newNum + ']", this.value)');

and then i am validating these fields in ajjax page.

thank you for helping me...

Category:php Views:9 Time:2018-12-12

Related post

  • How to instantly display data after form submission using jQuery and AJAX? 2011-11-19

    I have a PHP form that uses jQuery/AJAX to submit data into a MySQL database table. Currently, I have a message display saying " Done!" once the form is submitted, but would like the actual data to instantly display after it has been submitted. I hav

  • Validation problems when using jQuery and Ajax to post back form in partial view 2011-10-03

    I am having some challenges with validation in my ASP.NET MVC3 project when using jQuery and AJAX to post back data from a partial view. Adding validation to the NoteText field within my partial view results in "$('#noteAdd').submit" event failing to

  • Form validation with jQuery and php 2010-06-29

    I have a form which I'm validating using jQuery and php. So basically if the php echoes "input must be filled" the jQuery should put a red border around that input, but the thing works only after submitting the form two times. I explain: if I submit

  • how to get a div and its content from a php file using jquery and ajax? 2011-12-04

    how to get a div and its content from a php file using jquery and ajax? For example, php file echo "<div class='test1WrapperDiv'>"; echo "<div><p> Row 1 </p></div>"; echo "<div><p> Row 2 </p></div

  • Performing both client side and server side validation using jQuery and CodeIgniter 2010-03-13

    What is the right way of doing both client side and server side validation using jQuery and CodeIgniter? I am using the jQuery form plugin for form submit. I would like to use jQuery validation plugin ( for c

  • Adding items to a collection on a ASP.NET MVC site using jQuery and AJAX 2010-11-17

    I'm creating a UX experience that will allow the user to add items to a collection by using a jQuery button, and some AJAX. My problem is, when the user finishes adding items and filling out the rest of the form, they complete the form, which I want

  • Using Jquery and Ajax to save a file in ASP.Net 2010-06-24

    I have a button that uses jquery and ajax to call a server side script to create a text file and sends back the following response Response.ContentType = "csv"; Response.AddHeader("Content-disposition", "attachment; filename=" + fName); Response.Cont

  • How to add custom form validation using Jquery Validation Plugin for multiselect input? 2011-04-27

    I need to create a custom jquery form validation using Jquery Validation Plugin where the multiselect option has following kind of values: Code1(A) Code2(A) Code3(B) Code4(C) Code5(A) Code6(B) Code7(C) <select id="code_ids" multiple="multiple" nam

  • Response from Server using Jquery and Ajax 2012-03-24

    im having a problem with getting any response from my server using Jquery and Ajax. Server side: $data = strtotime("now"); echo $data; // $data Client side: html code... <script type="text/javascript" src=".../modjpicker2.js"></script>

  • Dynamic Collection Select in Rails using jQuery and AJAX 2011-08-04

    I have a simple application, in which I allow users to create posts. In order to create a post, users need to select a category. I want to use a collection select to show the category. When a user selects a category, I need to show another collection

  • Rebinding functions on dynamic content using jQuery and AJAX 2009-02-03

    I'm in the process of building a back-end admin panel for a site and I'm having an issue with the jQuery and AJAX code is use to build the page. On load, I bind actions to certain table fields allowing users to add or delete a colour or size. When th

  • IE error when using jQuery and Ajax 2011-12-26

    So I am very new to using jQuery and I have a script that updates posts on a page when load more is clicked. It works fine in Chrome and Firefox but nothing happens in IE. Does anyone know why? jQuery Script function get(){ $("#acomment").empty().htm

  • Check username availability using jquery and Ajax in rails 2011-12-29

    I am using rails with jquery and ajax to check the availability of username. I am using the following plugin for jquery validation purpose. In my controller i am using the following method to ch

  • How to use jQuery and Ajax to return just one string and how to insert it to a DDL in a jdialog? 2010-10-02

    I'm trying to create a dynamic module where I drop an object on screen. Then a jQuery dialog opens with three drop-down lists. When I select a value in the first drop-down list I'm trying to filter the results in the next list via Ajax. This is my JS

  • Form validation with jQuery and Codeigniter? 2011-05-27

    Is there any tutorial or other helpful resource to create form validation with jQuery using Codeigniter 2.0.2 I have been searching but didnt find any. As I've just started learning Codeigniter, I'd prefer to have some helpful tutorial or any resourc

  • How to remove all style attributes using jquery and also in PHP? 2011-06-06

    Possible Duplicates: php regexp: remove all attributes from an html tag Remove style attribute from HTML tags EDITED: For example i am having the following content: <div style="text-indent: -76.5pt; margin: 0in 54.9pt 0pt 76.5pt;"><strong

  • Form validation using jQuery-Ajax 2011-03-09

    When it comes to normal POST, GET methods, I usually know my way around. However, implementing ajax-jQuery into my code to make form validation is proving a huge step for me to learn. I have a form that has 3 fields: email, confirm email, and passwor

  • Login form validation using javascript and php 2010-05-23

    I have been trying to create a login form using JavaScript. My login form needs to do the following using JavaScript validation login field contains only letters with a minimum of 4 and a maximum of 6 letters password is at least 5 characters long an

  • Cross-domain PHP calls using jQuery and AJAX 2010-06-20

    I have a problem where the server I'm using is not configured to allow PHP or CGI and I need to send a mail using variables received from a form on this server to the owner, like a general enquiry/feedback form. Does anyone know how I can call a simp

  • Submitting a dynamic form using jQuery and AJAX 2010-09-07

    I am cloning a HTML drop down list using jQuery, the problem I have now is that there is no limit to the amount of cloned sections, and I have to capture all of the sections into a mySQL database. How can I get all of those different sections with di

  • Submit a form on click but not submit using jquery and ajax 2011-08-30

    i want to submit all form's infomation with an onclick event function (i don't want to use a conventional submit ). How can i use the post or ajax method? here is my code $("#login_form").bind("click", function() { var qtyVal = document.getElementsBy

  • How to add new form fields using jQuery and $form helper? 2010-02-25

    I'm trying to let a user to do a 'Click here to add more info' link. I'm trying to do this with input fields so that the id of the field have to increment. I would like for jQuery to add this on every click where $i is the number of each field increm

  • Update data using jQuery and Ajax 2010-07-09

    I am new to ASP.NET and building a financial web application. I have a form with a code behind file. On my form I have 5 text boxes which populates on PageLoad event and user can modify the field values and update in database so therefore I have a bu

  • dynamic drop down lists, how to use JQuery and AJAX instead? 2009-10-08

    I have written some code that works using ASP.Net, C# and AJAX update panels. I have created this user control, in which a repeater is populated by the contents of the BusinessTier datatable. For each business tier, there are associated business leve

  • Using jQuery and AJAX works for all functions except one, really bizarre issue (from my perspective) 2010-04-29

    I am working on a classic asp form that has a number of dropdowns. Three of these are cascading, i.e. they rely in the previous dropdown. For almost everything this code works fine, one of them however is not playing nice. To start off I have a scrip

Copyright (C), All Rights Reserved.

processed in 0.149 (s). 11 q(s)