We Keep Coding

Checked all the data entries in datatable

If a user clicks the button "Select ALL", all the data in the table from page 1 until the last page should be checked. However, it will only check the first page of the list because only the first page is displayed and has class.
I have this code:
var clicked = false;
$("#ExportAll").on("click", function () {
$(".ExportOrder").prop("checked", !clicked);
clicked = !clicked;
});
How can I check all the data from page1 until the last page and will send all the checked data in the controller as well? It uses datatable.
//Edited
I have modify my codes to be like this and was able to check all the column across different pages however when I clicked the Export button and only those current display will be sent to controller
$(document).ready(function () {
var oTable = $('#orders-table').dataTable({
stateSave: true
});
$("#ExportAll").on("click", function () {
oTable.$("input[name='ExportOrder']").attr('checked', $(this.checked));
});
});
Here is the controller:
public ActionResult PostToStarShipIt(string[] ExportOrder)
{
}
The number of data in ExportOrder is only those in the current display list although all of the list are checked. How can I get all the checked data? Thanks for helping.

Can't run 2 different scripts on the same yiigridview in yii

So I have this gridview:
<?php $this->widget('zii.widgets.grid.CGridView', array(
'id'=>'symptoms-grid',
'selectableRows'=>1, //ability to select one symptom at a time
'dataProvider'=>$model->search(),
'htmlOptions'=>array('id'=>'symptomsSearchgrid'),
'columns'=>array(
'symptomCode',
'title',
'inclusions',
'exclusions',
'symptomCategory',
),
)); ?>
And this javascript....script:
Yii::app()->clientScript->registerScript('search', "
$( document ).ready(function() {
$('#symptomSelectDiv').hide();
$('#categorySelectDropDown').change(function(){
$('#symptomSelectDiv').show();
$('#symptoms-grid').yiiGridView('update', {
data: $(this).serialize()
});
return false;
});
$('#symptomsSearchgrid table tbody tr').on('click', function() {
var firstColVal = $(this).find('td:first-child').html();
$('#symptomToBeSearched').val(firstColVal);
});
});
");
My problem is that I can only either get the
$('#symptoms-grid').yiiGridView('update', {
data: $(this).serialize()
});
function to work or the:
$('#symptomsSearchgrid table tbody tr').on('click', function() {
var firstColVal = $(this).find('td:first-child').html();
$('#symptomToBeSearched').val(firstColVal);
});
one, and it seems quite random too. Basically in order to get the other function to "start working" I have to change the id (either the grid id or the DOM id) of one function to something different for the other function to work (while the other doesn't).
So let's say at first the update function works and the click function doesn't. Then I change the ID of update to something wrong and click works. Then I change the id of update back to the correct one, but it still doesn't work, yet click works. THen I change click to a wrong id and update starts working correctly. But again, if I change click to the correct id it doesn't work.....
Any ideas what I'm doing wrong?

I think your issue is that your are giving your grid two id's one when creating it and one in htmloption.

how to get exact id values of a table

I'm trying to sort out this problem but have yet to get results. I tried to get the exact id values of the row which I edit in order to perform an update.
I can get get my current cell value but I can't get the corresponding id values of the cell. I iterate over the table id value which in turn get's all the id values of the table.
I'm using this jquery code for iteration:
$('#table').ready(function() {
$(this).find('.filename').each( function() {
alert($(this).html());
})
})
Then I tried this simple JavaScript:
var fid= document.getElementById("filename").textContent;
It gets only the first id value of the table.
For example, if I edit the first row the id value is 53.
If I edit the second row the id value should be 52 but it gets only 53.
See this link, I have posted this question previously.

getElementById gets the element and not the id. The id is what you are providing as parameter.
You could simply do:
$('#table').ready(function() {
$(this).find('.filename').each( function() {
alert(this.id);
}) ;
});
Instead of cluttering the DOM with id's (which should always be unique) you could always use the data-attributes of elements:
<tr data-identifier="53"><td></td></tr>
$('#table').ready(function() {
$(this).find('.filename').each( function() {
// if this is the row
alert($(this).data('identifier'));
}) ;
});

I am not quite sure that i understand your question but this will give you ids of all cells within a table:
$("#table > td").each(function(){
alert($(this).attr("id"));
});

hi thanks for ur response ,i tried a different script and it was working as i thought
here is the code
function doubleclick(table,id1)
{
table.innerHTML="<input type=text name=tab onBlur=\"javascript:submitNewName(this,'"+id1+ "');\" value=\""+table.innerHTML+"\">";
table.firstChild.focus();
// alert(id1);
}
function submitNewName(text,id2)
{
text.parentNode.innerHTML=text.value;
$.ajax({
url: 'update',
data:{text1:text.value,fileid1:id2},
type:"POST",
dataType:"json",
error:function(data){
//alert('error')
},
success: function(data) {
//alert('updated!')
}
});
}
html:
//when double clicked it will pass both ${item.filedesc},${item.id}
<td ondblclick="javascript:doubleclick(this,${item.id});" >${item.filedesc}</td>

Remove html elements added dynamically with JQuery

In my html page, I have a select with some options.
When selecting an option, an ajax call is fired passing the option's value to a php script, which returns an html fragment (another select) with a certain id that is appended to the page.
When the user selects another option from the first select, the event is fired again, the ajax call is executed and another html fragment (with the same id) gets appended to the page.
I want that, if the event is fired a second time, the appended element is removed form the page before appending the new one.
At the moment I'm using this code:
$(document).ready(function() {
$("#id_serie").change(function() { //#id_serie is the if of the first select
if ($("#id_subserie_label")) { //#id_subserie_label is the id of the html element returned by the ajax call
console.log("Removing");
$("#id_subserie_label").empty().remove();
}
var url = 'myscript.php';
var id_s = $(this).val();
$.post(url, {id_serie: id_s}, function(data) {
$("#id_serie").parent().after(data);
});
});
});
This is not working though, the html element returned by the second ajax call is appended after the element returned from the first call (because the element with id #id_subserie_label is not in the page when the script is loaded?).
How can I achieve what I need?

You're very close.
Just change if ($("#id_subserie_label")) to if ($("#id_subserie_label").length):
$(document).ready(function() {
$("#id_serie").change(function() {
if ($("#id_subserie_label").length) { // <=== change this line
console.log("Removing");
$("#id_subserie_label").empty().remove();
}
var url = 'myscript.php';
var id_s = $(this).val();
$.post(url, {id_serie: id_s}, function(data) {
$("#id_serie").parent().after(data);
});
});
});
See The jQuery FAQ: How do I test whether an element exists?.
This is because, as Ivo points out:
$("#id_subserie_label") is an object, and objects always evaluate to true.
As per Andy E's comment, you can simplify your code to this, if you don't need the console.log() call:
$(document).ready(function() {
$("#id_serie").change(function() {
$("#id_subserie_label").empty().remove();
var url = 'myscript.php';
var id_s = $(this).val();
$.post(url, {id_serie: id_s}, function(data) {
$("#id_serie").parent().after(data);
});
});
});

Populating a FilteringSelect datastore from an onChange event

I'm trying to bind an onChange event of one FilteringSelect to populate another FilteringSelect.
// View
dojo.addOnLoad(function () {
dojo.connect(dijit.byId('filterselect1'), 'onChange', function () {
dijit.byId('filterselect2').store = new dojo.data.ItemFileReadStore(
{ url: "/test/autocomplete/id/" + dijit.byId("filterselect1").value }
);
});
});
The JSON is generated from what I can tell correctly from a Zend Action Controller using a autoCompleteDojo helper.
// Action Controller
public function autocompleteAction()
{
$id = $this->getRequest()->getParam('id');
$select = $this->_table->select()
->from($this->_table, array('id','description'))
->where('id=?',$id);
$data = new Zend_Dojo_Data('id', $this->_table->fetchAll($select)->toArray(), 'description');
$this->_helper->autoCompleteDojo($data);
}
I receive the JSON from the remote datastore correctly, but it does not populate the second FilteringSelect. Is there something else I need to do to push the JSON onto the FilteringSelect?

I couldn't believe this was causing the problem, but the whole issue boiled down to the fact that it appears that a dojo ItemFileReadStore REQUIRES the label property of the JSON to be "name". In the end this is all that it required to wire them together.
dojo.addOnLoad(function () {
dijit.byId('filtering_select_2').store = new dojo.data.ItemFileReadStore({url: '/site/url'});
dojo.connect(dijit.byId('filtering_select_1'), 'onChange', function (val) {
dijit.byId('filtering_select_2').query.property_1 = val || "*";
});
});
UPDATE: The property within Zend form has been fixed as of ZF 1.8.4

Try console.log() in the event to see if it is launched. Changing the store should work, however for other widgets like grid you have also to call refreshing methods.