简体   繁体   中英

Append radio button

How to append radio button using jquery or javascript to save into the databse?

I appended input types like text,textarea,checkbox,select with options.

My code is

 <!DOCTYPE html>
<html lang="en">
<head>
<title>
apnd
</title>
<script src="jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
var htmldata='<div>Name<input type="text" name="cname[]">Mobile Number<input type="text"name="mob[]">Gender<input type="radio" name="gender[]" value="M">Male<input type="radio" name="gender[]" value="F">FemaleAddress<textarea name="address[]"></textarea><input type="button" class="remove_field" value="remove"></div>';
$('.add_field').click(function(){
$('.wrapper').append(htmldata); 
});
$('.wrapper').on('click','.remove_field',function(){
$(this).parent('div').remove(); 
});
});
</script>
</head>
<body>
<div class="container">
<form method="post" action="">
<div class="wrapper">
<div>
    Name<input type="text" name="cname[]">
    Mobile Number<input type="text" name="mob[]">
    Gender<input type="radio" name="gender[]" value="M">Male
          <input type="radio" name="gender[]" value="F">Female
    Address<textarea name="address[]"></textarea>
    <input type="button" class="add_field" value="Add">
</div>
</div>
<input type="submit" name="sub" value="Save">
</form>
</body>
</html>

using php I want to save the values to database.

$name=sc_sql_injection($_POST['cname']);
        $mobile=sc_sql_injection($_POST['mob']);
        $gender=sc_sql_injection($_POST['gender']);
        $address=sc_sql_injection($_POST['address']);
        $count=count($_POST['cname']);
        for($i=0;$i<$count;$i++)
        {
            $sql="insert into t2(name,mobile,gender,address) values('$name[$i]','$mobile[$i]','$gender[$i]','$address[$i]')";
            sc_exec_sql($sql,$con);
   }

Update 在此输入图像描述

Append radio button

<!DOCTYPE html>
    <html lang="en">
    <head>
    <title>
    apnd
    </title>
    <script src="jquery.min.js" type="text/javascript"></script>
    <script>
    $(document).ready(function(){
            var i=1;
    $('.add_field').click(function(){
    var htmldata='<div>Name<input type="text" name="cname[]">Mobile Number<input type="text"name="mob[]"> Gender<input type="radio" name="gender['+i+']" value="M">Male<input type="radio" name="gender['+i+']" value="F">Female Address<textarea name="address[]"></textarea><input type="button" class="remove_field" value="remove"></div>';
            i++;
    $('.wrapper').append(htmldata); 
    });
    $('.wrapper').on('click','.remove_field',function(){
    $(this).parent('div').remove(); 
    i--;
    });
    });
    </script>
    </head>
    <body>
    <div class="container">
    <form method="post" action="">
    <div class="wrapper">
    <div>
        Name<input type="text" name="cname[]">
        Mobile Number<input type="text" name="mob[]">
        Gender<input type="radio" name="gender[0]" value="M">Male
              <input type="radio" name="gender[0]" value="F">Female
        Address<textarea name="address[]"></textarea>
        <input type="button" class="add_field" value="Add">
    </div>
    </div>
    <input type="submit" name="sub" value="Save">
    </form>
    </body>
    </html>

 $(document).ready(function(){ var i=1; $('.add_field').click(function(){ var htmldata='<div>Name<input type="text" name="cname[]">Mobile Number<input type="text"name="mob[]"> Gender<input type="radio" name="gender['+i+']" value="M">Male<input type="radio" name="gender['+i+']" value="F">Female Address<textarea name="address[]"></textarea><input type="button" class="remove_field" value="remove"></div>'; i++; $('.wrapper').append(htmldata); }); $('.wrapper').on('click','.remove_field',function(){ $(this).parent('div').remove(); i--; }); }); 
 <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> </head> <body> <div class="container"> <form method="post" action=""> <div class="wrapper"> <div> Name<input type="text" name="cname[]"> Mobile Number<input type="text" name="mob[]"> Gender<input type="radio" name="gender[0]" value="M">Male <input type="radio" name="gender[0]" value="F">Female Address<textarea name="address[]"></textarea> <input type="button" class="add_field" value="Add"> </div> </div> <input type="submit" name="sub" value="Save"> </form> </body> </html> 

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM