passing array value to url in jquery ajax - javascript

i'm passing the array value to url like this
view code
from_multiselect('functio[]',$function,'','id=function')
baseurl/test/roles?id=1,2,3
this is my jquery
$("#role > option").remove();
var id = $('#function').val();
alert(id);
var str=new Array();
alert(id);
$.ajax({
type: "POST",
url: "test/roles?id="+id,
success: function(roles)
{
alert(roles);
$.each(roles,function(id,roles)
{
var opt = $('<option />');
opt.val(id);
opt.text(roles);
$('#role').append(opt);
});
}
});
});
});
Page give error when i pass the array value in url like Disallowed Key Characters.
Thank in advance

and then post this array like this:
$("#role > option").remove();
var id = $('#function').val();
var valArray = id.split(',');
var str=new Array();
alert(id);
$.ajax({
type: "POST",
url: "test/roles?id="+valArray,
success: function(roles)
{ alert(roles);
$.each(roles,function(id,roles)
{
var opt = $('<option />');
opt.val(id);
opt.text(roles);
$('#role').append(opt);
});
}
});
});
});
in the method add parameter to accept array.

This is CodeIgniter error.
So, to solve this, please go to
/application/config/config.php
AND
search for
$config['permitted_uri_chars']
change to:
$config['permitted_uri_chars'] = 'a-z 0-9~%\.\:_\+-,?&=';

Related

Jquery ajax issue in php and ajax code

Here in the following code in jquery i get the alert test1 but when i try to get alert test2 i dint got that... there is some issue in code please help me to resolve.
$(document).ready(function() {
$(".delete-item-details").click(function() {
alert('test1');
var id = $(this).attr('ids');
alert('test2');
var order_id = $("#order_id").val();
goto_url = "/order/DeleteOrderDetailItems/" + id;
dataString = 'id=' + id + '&order_id=' + order_id;
$.ajax({
type: "POST",
url: goto_url,
data: dataString,
cache: false,
success: function(html) {
$("#row-id-" + id).fadeOut();
$("#total_span").html(html);
}
});
});
});
Please change this three lines in code and you will definitely get alert !!
alert('test1');
var id=$(this).attr('id'); // here you have written ids
alert('test2');
The default attribute is 'id' not 'ids'
If still now clear let me know i will help you out.
TRY
var id = $(this).prop('ids');

How get a variable from HTML in JavaScript/Ajax Call

I'm using Zend Framework 2.
I would like to know how to get data defined in html in my javascript code.
html
<tr class="MyClass" data-MyData="<?php echo json_encode($array);?>">
javascript
$(document).on('click','.MyClass', function () {
var temp =document.getElementsByClassName("data-MyData");
$.ajax({
url: path_server + "pathDefinedInMyConfig",
type: 'post',
encode: true,
dataType: 'json',
data: {
'temp ': temp
},
success: function (data) {
//some code
},
error: function () {
alert("ERROR");
}
});
});
The problem is I don't have access to row in my Controller method. And i want to have access to My $array defined in html in my Controller.
Problem is that you are trying to find a class by the name data-MyData, but the object you "want" to look for is "MyClass"
Try something like var temp =document.getElementsByClassName("MyClass").attr("data-MyData");
Even better is that since you click on the object with MyClass you can use $(this).attr('data-MyData');
then result will look like: var temp = $(this).attr('data-MyData');
Simply replace temp var assignment line:
var temp =document.getElementsByClassName("data-MyData");
with this one:
var temp = this.getAttribute("data-MyData");
Since you use jQuery use the following:
$('.MyClass').data('MyData')
or
$('.MyClass').attr('data-MyData')
use like this-
$(document).on('click','.MyClass', function () {
var temp =$(this).attr('data-MyData');
$.ajax({
url: path_server + "pathDefinedInMyConfig",
type: 'post',
encode: true,
dataType: 'json',
data: {
'temp ': temp
},
success: function (data) {
//some code
},
error: function () {
alert("ERROR");
}
});});
You have a wrong selector. document.getElementsByClassNames() returns the collections so you have to loop through to get the target element:
var temp =document.getElementsByClassName('MyClass');
[].forEach.call(temp, function(el){
console.log(el.dataset['MyData']);
});
or as you are using jQuery then you can use .data():
var temp =$(this).data("MyData");
and with javascript:
var temp =this.dataset["MyData"];
// var temp =this.dataset.MyData; // <---this way too.

How to store loaded value in JS?

I've got this statement:
$('#queueCount').load("http://localhost:8081/smsc/userRole/getQueueCount/");
#queueCount is a <div> id. How can I store loaded value in variable? For example, like this:
var value=$('#queueCount').load("http://localhost:8081/smsc/userRole/getQueueCount/");
Three ways.. (1st and 2nd preffered)
var vardata;
$.get('http://localhost:8081/smsc/userRole/getQueueCount/', function(data) {
vardata = data;
});
or
var vardata;
$.ajax({
url: 'http://localhost:8081/smsc/userRole/getQueueCount/',
success: function(data) {
vardata = data;
}
});
or
var vardata;
$('#queueCount').load("http://localhost:8081/smsc/userRole/getQueueCount/");
vardata = $('#queueCount').html();
http://jsfiddle.net/hjggsqx2/2/
This is how I'd do it. I also like the syntax [website] [classname/id name]. It is more convenient.
var $div = $('<div>');
alert($div);
$div.load('http://www.aligajani.com .container', function(){
// now $(this) contains .container
});

Getting wrong Form Data name when posting

I am trying to pass multiple parameters to a javascript function. When reviewing the post data I get incorrect data names.
HTML:
//Test function with button (HTML)
<button onClick='printList("projects",{"qid":1,"oid":3),getSampleEntity);'>Test getSampleEntity</button>
Javascript:
var getSampleEntity = function(oid, qid) {
//Returns Object
return $.ajax({
url: URL + 'downloadQuadrat_Organism.php',
type: 'POST',
data: { 'organismID': oid, 'quadratID': qid },
dataType: dataType
});
}
....
var printList = function(lid,options,get) {
var items = get(options);
var list = $("ul#"+lid);
list.empty();
items.success(function(data){
$.each(data, function(item,details) {
var ul = $('<ul/>');
ul.attr('id', lid+'_'+details.ID);
var li = $('<li/>')
.text(details.ID)
.appendTo(list);
ul.appendTo(list);
$.each(details,function(key,value) {
var li = $('<li/>')
.text(key+': '+value)
.appendTo(ul);
});
});
});
}
The resulting post data:
organismID[qid]:1
organismID[oid]:3
I see what is happening, but my question is how do I pass multiple parameters in to my printList() so that those parameters will be passed effectively to getSapleEntity()?
Try
var items = get(options.oid, options.qid);

How to get values of checkbox jquery in two separate arrays one contaings checked values and other unchecked

Below is the code through which I get the values of checked input boxes:
$('#agent_region').click(function()
{
var ids = $('#agent_favourites_form input:checked').map(function(){
return this.value;
}).get();
$.ajax({
type: "POST",
url: "set_agent_favourites.php",
data: {map: ids},
success: function(msg){
$.jnotify(msg, 3000);
}
});
return false;
});
I want to get the values of unchecked checkboxes as well and pass it, I don't know how to pass two data: {map : ids}, {map1 : ids1} or something else. Please help.
You can use input:not(:checked) and just add it into your data object:
$('#agent_region').click(function()
{
var ids = $('#agent_favourites_form input:checked')
.map(function(){
return this.value;
}).get();
var nonids = $('#agent_favourites_form input:not(:checked)')
.map(function(){
return this.value;
}).get();
$.ajax({
type: "POST",
url: "set_agent_favourites.php",
data: {map: ids, unmap: nonids},
success: function(msg){
$.jnotify(msg, 3000);
}
});
return false;
});
Use the jQuery checked selector
See: http://api.jquery.com/checked-selector/
$(function() {
var checked = {};
var unchecked = {};
$('input[type=checkbox]').each(function() {
if ($(this).is(':checked')) {
checked[$(this).attr('name')] = $(this).val();
} else {
unchecked[$(this).attr('name')] = $(this).val();
}
});
// Only works with FireBug enabled
console.debug(checked);
console.debug(unchecked);
});
Demo: http://jsfiddle.net/x3TcD/

Categories

Resources