[jQuery] retrieve tr id
Hi. I have a table set up with multiple rows. Once a row is
selected, the class of the row changes to clicked. The id of the
row is the sequence number, and each td within that row has an id
of the sequence number plus a title, such as account. So, the id
of the first td in the first row is 1account. I have an Edit
Selected button which I would like to create a function for that
would retrieve all of the information from the clicked row and place
it in the edit row text fields and select boxes. This is what I have
for the edit button function right now:
$('#edit').click(function() {
var clickedID = $('.clicked').id;
$('#account').val() = clickedID + 'Account';
$('#reference').val() = clickedID + 'Reference';
$('#journalCode').val() = clickedID + 'Journal';
...
});
But, this doesn't work. How could I retrieve the id of the row and
add each title to it?
[jQuery] Re: retrieve tr id
Okay. So I'll tack the digits onto the end. So that it will be Account1, etc. The main thing I think I need is how to retrieve the id of an element once I know its class. Thanks.
[jQuery] Re: retrieve tr id
Okay. So I'll tack the digits onto the end. So that it will be Account1, etc. The main thing I think I need is how to retrieve the id of an element once I know its class. Thanks.
[jQuery] Re: retrieve tr id
Okay. So I'll tack the digits onto the end. So that it will be Account1, etc. The main thing I think I need is how to retrieve the id of an element once I know its class. Thanks.
[jQuery] Re: retrieve tr id
I have changed things a little now. Here is an example of my current
code:
$('#edit').click(function() {
var clickedID = $('.clicked').id;
transNo = ?; //This is where I need to retrieve the row's id
window.location = GL0002T?action=RtransBatchNo=!--%batch%--
transNo=+transNo;
});
tr id=1 class=row
td id=Sequence1 style=width: 80px;1/td
td id=Account1 style=width: 85px;400-04/td
td id=Reference1 style=width: 100px;Ref2/td
td id=Journal1 style=width: 114px;01/td
td id=Description1 style=width: 250px; text-align: left;Desc2/
td
td id=Debit1 style=width: 124px; text-align: right;100.00/td
td id=Credit1 style=width: 124px; text-align: right;border-
right: none;.00/td
/tr
tr id=2 class=alt row
td id=Sequence2 style=width: 80px;2/td
td id=Account2 style=width: 85px;400-04/td
td id=Reference2 style=width: 100px;Ref2/td
td id=Journal2 style=width: 114px;01/td
td id=Description2 style=width: 250px; text-align:
left;Desc2b/td
td id=Debit2 style=width: 124px; text-align: right;.00/td
td id=Credit2 style=width: 124px; text-align: right;border-
right: none;100.00/td
/tr
input type=button id=edit value=Edit Selected
When a row is clicked, I add a class of clicked to the row. After
the row is clicked, I click on the Edit button and the .click()
function is executed. I need to be able to retrieve the id of the
clicked row and pass it as a parameter to another program. I hope
this clarifies things.
Thanks
[jQuery] Re: retrieve tr id
So, I should probably populate the name or title of the tr with the sequence number, which is currently the id. You're right about getting rid of the class row. I'll take care of that. Perhaps there is a better way than what I've been trying. Each row has a distinct sequence number that I've used as the id, but could use as other things. When I click edit, I just want to pass that number back to the server, whether it be the id, title, class name, value, or whatever. I would rather not have to parse the number back out if at all possible even on the server side. Thanks for your help
[jQuery] click function populating value in a hidden field
Hi. I have a table set up with a .click() function on each row so
that if it is clicked on, a class is added to the row thus changing
the background, etc. I was wondering if there was is a way to take
the id of the row that was clicked and populate a hidden field with
it. What would I need to include in my .click() function for this to
work?
Here is my current one:
$(tr).click(function () {
$(.clicked).removeClass(clicked);
$(this).addClass(clicked);
});
[jQuery] Re: click function populating value in a hidden field
Works like a charm! Thanks so much! :)
[jQuery] Re: click function populating value in a hidden field
Works like a charm! Thanks so much! :)
[jQuery] Re: click function populating value in a hidden field
Works like a charm! Thanks so much! :)
[jQuery] JQGrid .setGridParam() causing error
Hi. I'm relatively new to JQGrid, and I'm trying to create my first
grid that is loaded based on what the user chooses in a select box.
I've gotten it working for the first option that they choose.
However, after the grid is populated, I cannot get the data to change
by selecting a different option in the select box. The call to the
server side program is passing the same parameters each time. So, I
was looking into changing the parameter with .setGridParam(). I found
an example on the JQGrid Demonstration page called Search Big Sets
that is sort of related to what I'm trying to do. It has a function
called gridReload that it calls onclick of the submit button. I set
it to be executed onchange of my select box. Here is what my version
of it looks like
function gridReload()
{
var customer = $(this).val();
$('#results').setGridParam({url:rinvinqs2?customer=+customer,page:
1}).trigger(reloadGrid);
}
results is the id of the table. However, an error occurs that
says:
$(#results).setGridParam is not a function
I'm currently at JQGrid version 3.4.1. Does anyone know what might be
causing this?
Thanks.
[jQuery] retrieve value with JQuery
Hi. In one of my functions, I would like to test the value of a
certain field with an id=zipCode. Here is my current code:
function retrieveCityState()
{
if ($('#zipCode').value.length 4)
{
...
}
}
This test doesn't seem to work. How do I correctly handle this using
JQuery? Thanks.
[jQuery] Re: JQGrid Grid as subgrid not calling server-side program
I'm thinking that the problem might be in what external scripts I'm linking to. When I'm utilizing grid as subgrid, should I include anything other than JQGrid/js/grid.subgrid.js?
[jQuery] Re: JQGrid Grid as subgrid not calling server-side program
I'm thinking that the problem might be in what external scripts I'm linking to. When I'm utilizing grid as subgrid, should I include anything other than JQGrid/js/grid.subgrid.js?
[jQuery] JQGrid Grid as subgrid not calling server-side program
I have been trying to get a grid as a subgrid to work for about a week
now. When I click the plus sign in a row, I can see (via firebug)
that the code relative to the subgrid gets run, but the server program
doesn't. It's like it never calls the server-side program. If
someone could take a look at my code to see what's wrong with it, I
would appreciate it.
$(document).ready(function()
{
var columnNames = ['Warehouse','Quantity','Value'];
var columnModel = [
{name:'id', resizable:false, index:'id', width:50,
align:'center', sortable:false},
{name:'quantity', resizable:false, index:'quantity',
width:90, align:'center', sortable:false},
{name:'value', resizable:false, index:'value',
align:'center', width:55, sortable:false}];
var gridwidth = $('.tableContainer').width();
gridwidth = gridwidth-40;
$(”#results”).jqGrid(
{
url: “RINVINQ2″,
datatype: “json”,
mtype: 'GET',
colNames: columnNames,
colModel: columnModel,
//pager: jQuery('#pager2'),
rowNum: 50,
rowList: [10,20,50,100],
imgpath: “../javascript/JQGrid/themes/sand/images”,
viewrecords: true,
caption: “Inventory Status By Division”,
width: gridwidth,
height: '300px',
subGrid: true,
subGridRowExpanded: function(subgrid_id, row_id)
{
var subgrid_table_id;
subgrid_table_id = subgrid_id+”_t”;
jQuery(”#”+subgrid_id).html(”table
id='”+subgrid_table_id+”' class='scroll'/table”);
jQuery(”#”+subgrid_table_id).jqGrid(
{
url:”RINVINQ3?id=”+row_id,
datatype: “json”,
//mtype: GET,
colNames:
['Customer','Quantity','Amount','Last Release Date'],
colModel:
[
{name:customer,index:customer,width:
80,key:true},
{name:quantity,index:quantity,width:
130},
{name:amount,index:amount,width:
80,align:right},
{name:lastReleaseDate,index:lastReleaseDate,width:
80,align:right}
],
height: 100,
width: gridwidth,
rowNum: 20,
imgpath: “../javascript/JQGrid/themes/sand/
images”,
});
},
loadComplete: function()
{
$('#cb').prev().remove();
if($(”#results”).getGridParam(”records”)==0)
{
$('#noResults').dialog(”open”);
}
else
{
var page = $('#results').getGridParam(”page”);
var records = $('#results').getGridParam
(”records”);
var recordsPP = $('#results').getGridParam
(”rowNum”);
var x = records/recordsPP;
var returnArray = [];
if(x page)
{
iterLimit = records%recordsPP;
}
else
{
iterLimit = recordsPP;
}
for(var i=1; i=iterLimit; i++)
{
$('#'+i).children('td:first').next
().addClass('link').css(”cursor”,”pointer”).css(”color”,”blue”).css
(”text-decoration”,”underline”);
var ord = $('#'+i).children
('td:first').next().text();
$('#'+i).children('td:first').next().click
(function()
{
ord = $(this).text();
window.location.href = “inv0004?
productGroup=”+ord;
});
//returnArray = orderList.find(ord);
var truefalse = typeof returnArray;
if(truefalse != 'boolean')
{
$('#results').setSelection(i);
}
}
}
},
shrinkToFit: true,
jsonReader :
{
root: “rows”,
page: “page”,
total: “total”,
records: “records”,
repeatitems : false,
subgrid: { root:”rows”, repeatitems: true,
cell:”cell” }
[jQuery] $().jqGrid is not a function
Hi. I'm making my first attempt at utilizing JQGrid with a CGIDEV2
application. When loading the page, I keep getting an error that says
$(#results').jqGrid is not a function.
Here's my JS:
$(document).ready(function()
{
var columnNames = ['Product Group','Description','Turnover
Rate','Gross Margin','Rating'];
var columnModel = [
{name:'productGroup',index:'order asc',width:70,align:center},
{name:'description',index:'job',width:200,sortable:false},
{name:'itemClass',index:'purchaseOrder',width:
150,sortable:false}];
var gridwidth = $('.tableContainer').width();
gridwidth = gridwidth-25;
$(#results).jqGrid(
{
url: turnover2,
datatype: json,
mtype: 'GET',
colNames: columnNames,
colModel: columnModel,
pager: jQuery('#pager2'),
rowNum:20,
rowList:0,
imgpath:images/images,
sortname:'Product Group',
sortorder:desc,
viewrecords:true,
multiselect: true,
width:gridwidth,
height:'100%',
loadComplete: function()
{
//$('#cb').prev().remove();
if($(#results).getGridParam(records)==0)
{
$('#noResults').dialog(open);
}
else
{
var page = $('#results').getGridParam(page);
var records = $('#results').getGridParam(records);
var recordsPP = $('#results').getGridParam(rowNum);
var x = records/recordsPP;
var returnArray = [];
if(x page)
{
iterLimit = records%recordsPP;
}
else
{
iterLimit = recordsPP;
}
for(var i=1; i=iterLimit; i++)
{
$('#'+i).children('td:first').next().addClass('link');
var ord = $('#'+i).children('td:first').next().text();
returnArray = orderList.find(ord);
var truefalse = typeof returnArray;
if(truefalse != 'boolean')
{
$('#results').setSelection(i);
}
$('#'+i).children('td:first').next().click(function()
{
ord = $(this).text();
window.location.href = turnover2;
});
}
}
},
shrinkToFit: true,
jsonReader :
{
root: rows,
page: page,
total: total,
records: records,
repeatitems : false
}
});
});
Here's my HTML:
div class=tableContainer
div class=searchResults id=table
table id=results class=scroll cellpadding=0
cellspacing=0
/table
div id=pager2 class=scroll style=text-
align:center;/div
/div
/div
Does anyone know something for me to try here?
[jQuery] Re: $().jqGrid is not a function
I had been messing around with the paths but couldn't seem to get it to work. However, when you open JQuery.JQGrid.js, you see that one of the first lines is var pathtojsfiles = js/; // need to be adjusted When I changed js/ to point to all of the other Javascript files associated with JQGrid, it worked just fine. So, I changed it from js/ to ../JavaScript/JQGrid/js/. Thanks.
[jQuery] Re: $().jqGrid is not a function
I had been messing around with the paths but couldn't seem to get it to work. However, when you open JQuery.JQGrid.js, you see that one of the first lines is var pathtojsfiles = js/; // need to be adjusted When I changed js/ to point to all of the other Javascript files associated with JQGrid, it worked just fine. So, I changed it from js/ to ../JavaScript/JQGrid/js/. Thanks.
[jQuery] Generated id seems not to trigger click event
Hi. I'm using CGIDEV2 with AJAX, JQuery, and JSON to page through
search results (showing 100 at a time). For the paging, I have a
beginning arrow, page left arrow, page right arrow, and an end arrow.
When I am on the first page of results, the beginning and page left
arrows have an id of beginningDeactivated and pageLeftDeactivated
respectively. Once the page right arrow is clicked and thus taken to
the second page, I use .attr to change the ids to beginning and
pageLeft. Then, I have the following waiting for a click on
pageLeft.
$('#pageLeft').click(function()
{
...
}
However, if I click on the element with the id of pageLeft, the
event is not triggered. I've quadruple checked the id using firefox's
firebug, and it is the exact same. Could it be that since the
original id of this element was not pageLeft (instead, it was
pageLeftDeactivated), the click function assigned to an element with
the id pageLeft will never be triggered? Or is it just something
else that I'm not thinking of? I will post code if I need to. I just
didn't want to clutter things up.
