passing to ajax an array from multiple selected dropdown - php

this is my Jquery:
$('#Save').click(function () {
var realvalues = new Array(); //storing the selected values inside an array
$('#Privilege :selected').each(function (i, selected) {
realvalues[i] = $(selected).val();
});
$.ajax({
type: "POST",
traditional: true,
url: "http://localhost:8081/crownregency/UpdateOrCreateOrDeleteUser.php",
data: {
Privilege: realvalues,
ID: '1'
},
success: function (data) {
alert(data, 'Status');
location.reload();
}
});
});
this is my php.
I have read quiet a lot about serializing but doesnt seem to work, what i am trying to achieve is sending the selected items of a dropdown into an array and sending it to a php through ajax. but sending the array to the php doesnt seem to work. help anyone?

Your code is okay just remove the traditional: true and your code seems to work
$('#Save').click(function(){
var realvalues = new Array();//storing the selected values inside an array
$('#Privilege :selected').each(function(i, selected) {
realvalues[i] = $(selected).val();
});
$.ajax({
type: "POST",
url: "http://localhost:8081/crownregency/UpdateOrCreateOrDeleteUser.php",
data: {Privilege: realvalues, ID: '1'},
success:function(data){
$("#subscrres").html(data)
}
});
});
HTML
<form method="post">
<select id="Privilege" multiple="multiple">
<option value="yahoo">yahoo</option>
<option value="chrome">chrome</option>
<option value="mozilla">mozilla</option>
</select>
<input type="button" id="Save"/>
</form>
UpdateOrCreateOrDeleteUser.php
<?php
if(isset($_POST['Privilege'])){
$myvar =$_POST['Privilege'];
foreach($_POST['Privilege'] as $one)
echo $one."<br/>";
}
?>

Related

jquery selectmenu variable in php via ajax

I want to get a jquery (a selectmenu) variable to php. I try it with Ajax "POST". For testing purpose i just want to echo out the selected number of the selectmenu without any page refresh. So the Change should appear dynamically.
Here is my html_file.php
<script> $( function() {
$( "#number" )
.selectmenu()
.selectmenu( "menuWidget" )
.addClass( "overflow" );
$.ajax({
method: "POST",
url: "php_file.php",
data: { number }
})
/* Here we receive the data back */
.done(function(data) {
/* Here you can do whatever you want with the data */
$("#response").html(data);
});
} );
</script>
<select name="number" id="number">
<option>1</option>
<option selected="selected">2</option>
<option>3</option>
</select>
<div id='response'></div>
And here the php_file.php
<?php
$test = $_POST['number'];
// Output of the selcetmenu for testing
echo '<div class="profile-font2">', $test, '</div>';
?>
I think there is some mistake in the Ajax function.
Pass key as number and assign value to number key as
$.ajax({
method: "POST",
url: "php_file.php",
data: { number : yournumber }
})
You have to give your data property a value.
Try:
$.ajax({
method: "POST",
url: "php_file.php",
data: {
number: $("#number").val()
}
})

Using AJAX to retrieve values from <select> dropdown?

I want to retrieve the value of my dropdown on change, and post it to my PHP (at the moment, the PHP is just var_dump, for debugging purposes)
I'm stuck at posting the selected value to my AJAX, seemingly there no change.
I Using WP framework to load scripts and run them through admin-ajax.php -- I've been
using this approach for others AJAX functions, and it is working.
I have a dropdown list, like this:
HTML
<form action="" method="post">
<select name="count" class="count">
<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>
<input class="koordinator_id" type="hidden" name="koordinator_id" value="<?php echo $_SESSION['coordinator_id'] ?>">
</form>
AJAX
$(document).ready(function () {
$('select.count').change(function () {
alert("Whyunoalert?");
$.ajax({
type: "POST",
url: (my_ajax_script.ajaxurl),
data: ({
action: 'generate',
koordinator_id: $('input[name=$"koordinator_id"]').val(),
id: $('select.count').val()
}),
success: function (msg) {
alert("Data changed:" + msg);
}
});
});
});
PHP
function generate() {
$count = $_POST['id'];
var_dump($count);
$koordinator_id = $_POST['koordinator_id'];
var_dump($koordinator_id);
}
EDIT
I've changed the code accordingly to the first three comments. Now my code executes the AJAX but still no var_dump are made in the php file. Thanks for the help so far, hope you can do a bit more. Also i've added the functions.php code , where the php function is bound and the redirect to ajax-admin.php is setup.
functions.php
function load_scripts() {
wp_enqueue_script('local_jquery', '/wp-content/themes/tutorial_theme/scripts/scripts.js');
wp_enqueue_script('ajax_func', get_template_directory_uri() . '/scripts/ajax_implementation.js');
}
if (!is_admin())
add_action('wp_enqueue_scripts', 'load_scripts');
add_action('template_redirect', 'load_scripts');
$dirName = dirname(__FILE__);
$baseName = basename(realpath($dirName));
require_once ("$dirName/ajax_functions.php");
add_action("wp_ajax_nopriv_approve", "generate");
add_action("wp_ajax_approve", "generate");
2nd EDIT
removed this from the ajax: (was from old copy-paste)
dataType: 'html',
The selector $('input[name=$"koordinator_id"]') is wrong in your data line. The syntax for input name ending with some string is $('input[name$=somestring]'].
Use this instead:
$('input[name$="koordinator_id"]') // '$' needs to be before '='
^
First of all if you are firing ajax onchange event why did you wrap them in the form tag? remove it if no use other than onchange event.
Second is you're using action: 'generate' in your ajax function but you're not hooking the right action in your functions file of php
add_action("wp_ajax_nopriv_YOUR_ACTION", "METHOD");
add_action("wp_ajax_YOUR_ACTION", "METHOD");
So it would be
add_action("wp_ajax_nopriv_generate", "generate");
add_action("wp_ajax_generate", "generate");
Last but not least always exit your ajax method call, so make sure it won't fall below.
function generate() {
$count = $_POST['id'];
var_dump($count);
$koordinator_id = $_POST['koordinator_id'];
var_dump($koordinator_id);
exit;
}
Also as #Krishna answer remove the $ sign unexpected expression
koordinator_id: jQuery('input[name=$"koordinator_id"]').val(),
Need to be:
koordinator_id: jQuery('input[name="koordinator_id"]').val(),
You're missing the { after the .ready(function(). Fix it like this:
$(document).ready(function () {
$('select.count').change(function () {
alert("Whyunoalert?");
$.ajax({
type: "POST",
url: 'my_ajax_script.ajaxurl',
data: ({
action: 'generate',
koordinator_id: $('input[name=$"koordinator_id"]').val(),
id: $('select.count').val()
}),
dataType: 'html',
success: function (msg) {
alert("Data changed:" + msg);
}
});
});
});
Try like this
$(document).ready(function()
$('.count').change(function() {
$.ajax({
type: "POST",
url: 'my_ajax_script.ajaxurl',
data: {'action': 'generate', 'koordinator_id': $('input[name=koordinator_id]').val(), 'id': $('.count').val()}),
dataType: 'html',
success: function(msg) {
alert("Data changed:" + msg);
}
});
});
});
Also avoid using of php short tags.Sometimes it cause problems if your php version doesnt support short tags.So change this
<input class="koordinator_id" type="hidden" name="koordinator_id" value="<?php echo $_SESSION['coordinator_id'] ?>">

getting variable from javascript to php

I have a simple combo box whose value I can get in JavaScript.
I am doing that so I don't need to refresh the page.
Also I want to use the selected value to do some conditional branching after combo box so how do I get the value of combo box from JavaScript to my variable $change.
echo '<select id="combo_1">';
echo '<option value="2">Submative</option>';
echo '<option value="1">formative</option>';
echo '</select>';
Below is my JavaScript:
<script type="text/javascript">
$(document).ready(function() {
$('#combo_1').change(function(){
});
});
</script>
Here I want to do $change = $(this).val(), but obviously I cant do it like this.
Any suggestions?
i want to do it on the same page without refreshing or without submitting
my url kinda look like this
http://localhost/lms/grade/report/userdef/index.php
and i want it to be on click action
cuz depending on the choice of combobox 2 very different procedures will be called
You're gonna want to use AJAX and submit the form, then you can access the returned data without ever refreshing the page.
Basically:
HTML
<select name="combo" id="combo_1">
<option value="2">Submative</option>
<option value="1">formative</option>
</select>
JavaScript
$('#combo_1').change(function() {
$.post('calcScript.php', $(this).serialize(), function(data) {
alert(data);
});
});
in PHP, you can access your combo data via $_POST['combo'].
<script type="text/javascript">
$(document).ready(function() {
$('#combo_1').change(function(){
var combo_1 = $(this).val();
$.ajax({
type: 'GET',
url: 'ajax.php',
data: {'combo_1':combo_1},
success: function(data){
alert(data)
}
});
});
});
</script>
ajax.php
if( isset($_GET['combo_1]) ) {
echo $change = $_GET['combo_1'];
}
JS:
$.ajax({
type: "POST",
url: './filename.php',
beforeSend: function(){
//If you want to do something
},
data: 'data='$('#combo_1').val(), //Optional '&data2='+value+'&datan='+value,
success: function(msg){
alert(msg);
}
});
PHP:
$val = $_POST['data'];
return 'received successfully';
This will alert 'received successfully'

jQuery variable to php variable then use it on query

i have a problem when it comes to retrieving value from jQuery to php.i was able to get the value of my select and pass it to my php but i can't pass it back to php. here is the code...
<script>
$(document).ready(function()
{
$("select#months").change(function(event)
{
var m=$(this).val();
$.ajax({
type: 'POST',
url: "monthly_CRD.php",
data: {m: m},
success: function(){alert("updated")}
});
});
});
</script>
<div>
<select id="months">
<option value='00'>Month...</option>
<option value='01'>Jan</option>
<option value='02'>Feb</option>
<option value='03'>Mar</option>
<option value='04'>Apr</option>
</select>
<select id="years">
<?php
for($yr=10; $yr<=$year; $yr++)
{
echo "<option value='".$yr."'>".$years[$yr]."</option>";
}
?>
</select>
</div>
<?php
if (isset($_POST['m']))
{
$m = $_POST['m'];
echo $m;
} else {echo "fail";}
?>
it keeps on returning fail which means that isset is not working.
Change data: {m: m} to data: {"m":m}
Since you are looking at $_POST['m'] you need to define that key in your JSON. Currently you'd need to look inside $_POST['03'] if you selected Mar
If you mean that on page load, it returns fail, that is because on page load your $_POST array is probably empty.
If you want to know what was returned from your AJAX post, you need your success function to accept a parameter (like data) that jQuery will fill with the response to your post.
Then in the function body, you can write it to the DOM or your error console.
If you have an id to an element then just id is enough to select. Try this
$(document).ready(function()
{
$("#months").change(function(event)
{
$.ajax({
type: 'post',
url: "monthly_CRD.php",
data: { m: $(this).val()},
success: function(){
alert("updated")
}
});
});
});
$(document).ready(function()
{
$("#months").change(function(event)
{
$.ajax({
type: 'post',
url: "monthly_CRD.php",
data: '{ "m": "' + $(this).val() + '"}',
success: function(msg){
alert(msg)
},
error: function(msg) {
alert("An error happened: " +msg);
}
});
});
});
User fiddler of chrome tools to break on either success or error and check the value of the meesage property.

Jquery: Get value of more than one <select> drop-down

I am fetching user record from db-table like
<?php $row=1; ?>
<select id="status<?php echo $row; ?>" name="status<?php echo $row; ?>">
<option value="0">Active</option>
<option value="1">Block</option>
</select>
<?php $row++; ?>
----------------------------------------
Name Status
----------------------------------------
Abc Active
Def Block
Ghi Active
Jkl Block
----------------------------------------
where status is drop-down with two status for each user and If I want to change the status of any user then I select an option from that drop-down and at the same time the status must update in db-table.
For this I coded:
for(var r=1; r<=4; r++){
$("status").each(function() {
var sld = $("#status").val();
alert(sld);
$.ajax({
type: "POST",
url: "response.php",
data: "sld="+sld,
success: function(msg){
alert(msg); // this is the response
}
});
});
}
but for loop does not create script for each drop-down....
You'll need to remove that for loop, and use this code.
My event is now "change" and it will submit two variables, "id" and "sld". You then update your php script to check $_POST['id'] and $_POST['sld'] and then update these into the database.
add class="status" to each of the drop downs.
$(".status").change(function() {
var sld = $(this).val();
alert(sld);
$.ajax({
type: "POST",
url: "response.php",
data: { "sld": sld, "id":$(this).attr('id').replace('status','') },
success: function(msg){
alert(msg); // this is the response
}
});
});
$('status') would select elements that have the node name of status. Do you have that? Or did you mean $('.status')?
I think you are having more than one element with the same ID which will be an invalid HTML.
Put a class for your select boxes and then you can use something like this.
$("select.status").each(function() {
var sld = this.value;
alert(sld);
$.ajax({
type: "POST",
url: "response.php",
data: "sld="+sld,
success: function(msg){
alert(msg); // this is the response
}
});
});
Also I don't find any use of the for loop in the example.

Categories