Ragith Thomas Ragith Thomas - 10 days ago 5
jQuery Question

how to get looped textbox values with comma seperated in jSON to insert into mysql database in jquery

Thanks in advance. Actually I have a users combobox and below I have a courses textboxes and price textboxes which is coming from for loop. So I need to insert user's combobox value into mysql table " username " column, courses texboxes values with comma seperated into "course " column and prices textboxes values with comma seperated into "price" column. Something like this as below.

id | username | course | price
1 | Rakesh |PMP,COBIT,CAPM | 45,56,35


I have written a jquery code but i don't know how to combine all values and to pass in json format. Just i need to pass in jSON, other code to insert into mysql database is written in php.This php code i have written seperately.My code will show only jquery script as below.

<?php
$con = mysql_connect("localhost","root","");
if(!$con)
{
die("Could not connect:".mysql_error());

}
mysql_select_db("cakephp",$con);
$sql = mysql_query("select * from courses order by id desc");

?>
<html>
<head>
<title></title>
<script src="jquery.js"></script>
<script src="jquery.validate.min.js"></script>
<script src="jquery-ui.min.js"></script>
<style type="text/css">
.row_selected {background-color: #BFCBD7;}
</style>
<script>


$(document).ready(function(){

$('#btn').click(function(){

var userVal = $('#users').val();
alert(userVal);

$('.courses').each(function(){
var course = $(this).val();
alert(course);
});

$('.prices').each(function(){
var price = $(this).val();
alert(price);
});

$.ajax({

method: "POST",
url: "/invl_exams/submitprice",
cache: "false",
data: {examData: {username:userVal,courses:course,prices:price}},
dataType: "text",
success: function(strMessage){
//alert(strMessage);
console.log(strMessage);
//$('#msg').html(strMessage);

},
error: function(strMessage){
//alert('error');
console.log('error');
}



});

});

});


</script>

</head>
<body>
<form method="post" action="dynamicTextbox.php">
Users:<select name="users" id="users">
<option value="">-- select --</option>
<option value="Ramesh">Ramesh</option>
<option value="Suresh">Suresh</option>
<option value="Girish">Girish</option>
</select>
<table>
<?php

for($i=0;$i<4;$i++)
{

?>

<tr>
<td><label for='Course'>Course&nbsp;</label><input type='text' class='courses' name='txtcourse' value =''></td>
<td><label for='Price'>Price&nbsp;</label><input type='text' class='prices' name='txtprice' value =''></td>
</tr>

<?php
}
?>
<tr>
<td><input type="submit" name="btnSubmit" id="btn" value="Submit"></td>
<td>&nbsp;</td>
</tr>
</table>
</form>
</body>
</html>

Answer

You can concatenate the values of courses and prices in JavaScript separated by comma.

var course_arr = [];
$('.courses').each(function(){
     course_arr.push($(this).val()); // Push all values in array
});

var course = course_arr.join(', '); // Concatenate array by comma separated string

var price_arr = [];
$('.prices').each(function(){
     price_arr.push($(this).val()); // Push all values in array
});

var price = price_arr.join(', '); // Concatenate array by comma separated string

Now, variables course and price contains values in comma separated string which you have passed in AJAX. These values can be retrieved at PHP side and inserted into DB. Sanitize your inputs before inserting into DB.

Hope this helps!