0

I have create the form with selection option. Based on the selection i show and hide the form value and i don't know to save it in database. In my code there is selection option i show the form field again.for example if i select the option is 3 i am showing form field 3 times.

I want to store the data in backend(database). How to store the database.

My code

$(document).ready(function() {
  $('#hidden-div').hide();
  $("#select_btn").change(function() {
    toggleFields();
  });

});

function toggleFields() {
  var selectVal = $("#select_btn").val();
  if (selectVal <= 5) {
    $hiddenHtml = $('#hidden-div').clone().html();
    $("#refer").html('');
    for (var i = 0; i < selectVal; i++) {
      $("#refer").append($hiddenHtml);
    }
  }
}
$( "form" ).submit(function( event ) {
  console.log( $( this ).serializeArray() );
  event.preventDefault();
});
<html>
<head>
<title> Demo </title>
<meta name="robots" content="noindex, nofollow" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form name="referer" method="post" action="">
  <p>Name:
    <input type="text" name="referer_name" />
  </p>
  <p>Mobile:
    <input type="text" name="referer_mobile" />
  </p>
  <p>Email:
    <input type="text" name="referer_email" />
  </p>
  <p>No of Referrer:
    <select id="select_btn" >
      <option value="0">--Select--</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
    </select>
    <div id="hidden-div">
 <div id="text">Referral Details</div>
      <p>Name:
        <input type="text" name="name[]" />
      </p>
      <p>Mobile:
        <input type="text" name="mobile[]" />
      </p>
      <p>Email:
        <input type="text" name="email[]" />
      </p>
      
    </div>
    <div id="refer">

    </div>
    <p align="center">
      <input type="submit" value="Submit" />
    </p>
</form>
sakthi
  • 65
  • 1
  • 1
  • 11
  • any form component has to have a name before the value will be passed - try assigning a name to your select, then use that name in the same method as the other form components – Chris J Oct 04 '16 at 10:47
  • What database? MySQL, MSSQL, django, access? It looks to me like you don't even know that you need to set up your own database. Much, much more learning is needed before anyone can help you with this. http://www.tutorialspoint.com/mysql/ – Matthew Goulart Oct 04 '16 at 10:48
  • @ChrisJ He has no `action` in his form. he doesn't even have a database (my guess) – Matthew Goulart Oct 04 '16 at 10:49
  • True, but the form doesn't have to have an action, it can technically be assigned in the JS later (although not there at the mo). It's been tagged mysql, so assumed that would be the context, although there is a suspicion of what you're saying. – Chris J Oct 04 '16 at 10:51
  • mysql only. I have create the database and table....t i dont how to store the form value – sakthi Oct 04 '16 at 10:52
  • you need to `connection` code also `insert` statements. based on elements names you can access the values. also We Recommend to use `PDO` – Karthi Oct 04 '16 at 10:54
  • @KarthiVenture i have the database and table as referrer_details. But i dont know how to pass and store the value based on selection. For example if option is 3 then 3 records insert into database – sakthi Oct 04 '16 at 10:58

1 Answers1

0

<html>
<head>
<title> Demo </title>
<meta name="robots" content="noindex, nofollow" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form id ="refer-form" name="refer-form" action="validate.php"  method="post" >
 
  <p>No of Referrer:
    <select id="select_btn" >
      <option value="0">--Select--</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
    </select>
    <div id="hidden-div">
 <div id="text">Referrer</div>
      <p>Name:
        <input type="text" name="name[]" />
      </p>
      <p>Mobile:
        <input type="text" name="mobile[]" />
      </p>
      <p>Email:
        <input type="text" name="email[]" />
      </p>
      
    </div>
    <div id="refer">

    </div>
    <p align="center">
      <input type="submit" value="Submit" />
    </p>
</form>
<script type="text/javascript">
$(document).ready(function() {
  $('#hidden-div').hide();
  $("#select_btn").change(function() {
    toggleFields();
  });

});

function toggleFields() {
  var selectVal = $("#select_btn").val();
  if (selectVal <= 5) {
    $hiddenHtml = $('#hidden-div').clone().html();
    $("#refer").html('');
    for (var i = 0; i < selectVal; i++) {
      $("#refer").append($hiddenHtml);
    }
  }
}
/*$( "form" ).submit(function( event ) {
  console.log( $( this ).serializeArray() );
  event.preventDefault();
});*/

</script>


</head>
  <?php
for($i = 0; $i < count($name); ++$i) {
$link = mysqli_connect("localhost", "root", "", "test");
if($link === false){
     die("ERROR: Could not connect. " . mysqli_connect_error());
 }
 // Attempt insert query execution
 $sql = "INSERT INTO test1 (name,email,mobile) VALUES ('$name[0]','$email[$i]', '$mobile[$i]')";
 echo "$sql";
 if(mysqli_query($link, $sql)){
     echo "Records added successfully.";
 } else{
     echo "ERROR: Could not able to execute $sql. " . mysqli_error($link);
 } 

 // Close connection
 mysqli_close($link);
 }
?>

Here i attached working code for reference of any one

sakthi
  • 65
  • 1
  • 1
  • 11
Karthi
  • 528
  • 1
  • 5
  • 16
  • how to store the value based on the selection. if option is 2 i am showing two times of the form fields. How to pass it – sakthi Oct 04 '16 at 11:09
  • first read the above the kink what i have to post it. then TRYYYYY fianly ask your doubts. the link provide all things – Karthi Oct 04 '16 at 11:11
  • i create the database connection...How to insert the array value in the table – sakthi Oct 04 '16 at 12:07
  • try this http://stackoverflow.com/questions/15013211/how-to-insert-array-of-data-into-mysql-using-php – Karthi Oct 04 '16 at 12:09
  • print_r($_POST[name]); $count = count($_POST[name]); print_r($count ); for($i=0; $i<$count; $i++) { $sql = "insert into test1 (name,email,mobile) values ('$_POST[name][$i]','$_POST[email][$i]','$_POST[mobile][$i]')"; $res = mysql_query($sql); } i tried this it shows the following error insert into test1 (name,email,mobile) values ('Array[0]','Array[0]','Array[0]') Fatal error: Call to undefined function mysql_query() in C:\xampp\htdocs\validate.php on line 23 – sakthi Oct 04 '16 at 12:21
  • @sakthi i update my ans . just copy and past it. just change the connection and table name, column name.. its working perfectly . if its help to you accept my ans and upvote me – Karthi Oct 04 '16 at 12:28
  • hiArray ( [referer_name] => rfgdgd [referer_mobile] => 9875885858525 [referer_email] => ffffff [name] => Array ( [0] => [1] => dfddsf ) [mobile] => Array ( [0] => [1] => tghgfhggfh ) [email] => Array ( [0] => [1] => fgfdgfdgdfg ) ) when print the output. How to store the value in table – sakthi Oct 04 '16 at 13:04
  • http://stackoverflow.com/questions/29599422/how-to-insert-array-value-into-mysql-database – Karthi Oct 04 '16 at 13:06
  • my result is contain like Array ( [referer_name] => rfgdgd [referer_mobile] => 9875885858525 [referer_email] => ffffff [name] => Array ( [0] => [1] => dfddsf ) [mobile] => Array ( [0] => [1] => tghgfhggfh ) [email] => Array ( [0] => [1] => fgfdgfdgdfg ) ) – sakthi Oct 04 '16 at 13:13
  • i dont know thats y i put here – sakthi Oct 04 '16 at 13:26
  • i want to check the duplication entry of mobile no. how can i do this – sakthi Oct 05 '16 at 09:11
  • post new question – Karthi Oct 05 '16 at 09:50