I've table with with 3 column with the following name
name <----input field - first column
user <----CheckBox -second column
address<----CheckBoxv-third column
I've in the table in-line create and if user click on edit for specific row and
change the name /user/address and instead of save do cancel I want to restore the previos data,I was able to do this for the input property but not sure how to do it for the checkBoxes,any idea how?
This is how I restore the data for the name property
var $firstCell = $row.find("td:first"),
checkBox = $row.find("input[type=checkbox]"),
....
$firstCell.text(previousData.name);
In the previosData I store all the data when the user just click on edit
I think what you might be looking for is something like this:
var $checkboxUser = $row.find('input[name=user]'),
$checkboxAddress = $row.find('input[name=address]');
previousData.statusUserCheckbox = $checkboxUser.prop('checked');
previousData.statusAddressCheckbox = $checkboxAddress.prop('checked');
// ...
$checkboxUser.prop('checked', previousData.statusUserCheckbox);
$checkboxAddress.prop('checked', previousData.statusAddressCheckbox);
http://api.jquery.com/prop/
Related
hi i am using JQGrid and want to set value of a cell to zero when i edit the row and whatever the value of the cell is like if cell value is 103.50 i want to to set to 0
i try
editoptions:{dataInit : function (elem){$(elem).val("0");}}
and it works for only new but i want to reset value of cell to "0" even when i use form edit.
i also try
editoptions:{defaultValue:"0"}
and
editoptions:{value:"0"}
but all is working when use form edit for new row and when try to edit it show first time the default "0" value but when i cancel and again edit form then cell value is set in the text input field
i know its not logical but want to do for customer requirement and also search a lot for it
but unable to find any related proper answer
I think you need to set the value of the cell, when selecting the row, if it an inline edit.
onSelectRow: function (id) {
if (id) {
selectedRowId = id; // save current row ID
var myCellData = grid.jqGrid('getCell', selectedRowId , 'MyColName');
}
},
where id the row id, then you can find the cell value
Hope this helps you. Enjoy jqGrid.
beforeShowForm: function($form) {
setTimeout(function() {
$form.find('input#credit.FormElement').val(0);
},50);
}
works for me as when load the form i reset the value of Credit;
Been looking around and I cant seem to find an answer to this so maybe im wording it wrong but here it goes.
So I have a table displaying data from a database. In jQuery I have made it so a row can be added with empty inputs and then submitted to the database, this works fine.
I am now attempting to be able to edit it. So each row will have a button to edit that row, the button will put the row values into inputs so you can change the value and update the database. How can I do this? I was looking into using this here but Im not sure how I can get the value of the input boxes without them having some sort of ID.
jQuery I was trying to use:
$('#tbl').on('click','.xx',function() {
$(this).siblings().each(
function(){
if ($(this).find('input').length){
$(this).text($(this).find('input').val());
}
else {
var t = $(this).text();
$(this).text('').append($('<input />',{'value' : t}).val(t));
}
});
});
Am I over thinking this? Should I just be grabbing the values and then putting them in pre-made input boxes?
Update:
HTML:
sb.AppendLine("<table style='width: 80%;'>")
sb.AppendLine("<tr class='inputRowbelow'>")
sb.AppendLine("<td style='width: 20%;' class='ui-widget-header ui-corner-all'>Area</td>")
sb.AppendLine("<td class='ui-widget-header ui-corner-all'>Details</td>")
sb.AppendLine("<td class='ui-widget-header ui-corner-all'>Options</td>")
sb.AppendLine("</tr>")
For Each w In workItems
sb.AppendLine("<tr>")
sb.AppendLine("<td>" & w.area & "</td>")
sb.AppendLine("<td>" & w.details & "</td>")
sb.AppendLine("<td><a href='#' class='fg-button ui-state-default ui-corner-all edit'><img src='/images/spacer.gif' class='ui-icon ui-icon-pencil' /></a></td>")
sb.AppendLine("</tr>")
Next
sb.AppendLine("</table>")
There are a couple of ways to do this, including changing your VB code to add extra data to the html, but I will answer this from a pure javascript/JQuery solution.
First of all you need to handle the click event for each edit button, after that you find the matching row, and then you can get the first to td elements of that row...
$(".edit").click(function(e){
e.preventDefault();//prevent the link from navigating the page
var button = $(this);//get the button element
var row = button.closest("tr");//get the row that the button belongs to
var cellArea = row.find("td:eq(0)");//get the first cell (area)
var cellDetails = row.find("td:eq(1)");//get the second cell (details)
//now you can change these to your inputs and process who you want
//something like this...
ConvertToInput(cellArea, "area");
ConvertToInput(cellDetails, "details");
});
function ConvertToInput(element, newId){
var input = $("<input/>");//create a new input element
input.attr("id", newId);//set an id so we can find it
var val = element.html();//get the current value of the cell
input.val(val);//set the input value to match the existing cell
element.html(input);//change the cell content to the new input element
}
Here is a working example
From that you can then do the saving that you say you have already implemented, using the ID values of each field to get the values to save.
Instead of using a For Each ... in ... Next loop, use a a For loop with a counter. give each button and each row an ID with the current counter value at the end. You can then use Jquery to make each row editable separately, because each row has a row number now.
I am using 'CheckColumn' in 'gridpanel' and also I am using a window which contain a chart. In the window, when I click on some values in the chart, I have to set the corresponding check box as checked in the grid. My question is how to set a check box as checked programmatically? I got the row id of the corresponding value that I need but I do not know how to use it to check it.
Thanks a lot!
// in the code below, i am searching for the specific row how contain my value
grids.getStore().each(function(rec){
var rowData = rec.data;
if (rowData['value']==value)
{
var record = grids.getStore().getAt(rec.index);
// what i can do now? // thanks
}
});
i found what i need , just: add
rec.set('myfield', true);
thanks
I'm trying to use the following JavaScript function to get a particular cell value from a jqgrid upon click.
In the below function #datagrid is the table where the jqgrid is stored in.
$("#datagrid").click(function(){
var selr = $("#datagrid").getCol('companyid');
alert(selr);
});
My problem is when I click the jqgrid it will show ALL row id's from the jqgrid in the alert message, but I only need a particular companyid which was selected from the jqgrid. How do I make this work?
You should use getCell function to read the value from the cell identified by row id.
So, You should try something like this:
$("#datagrid").click(function(){
var grid = jQuery('#datagrid');
var sel_id = grid.jqGrid('getGridParam', 'selrow');
var myCellData = grid.jqGrid('getCell', sel_id, 'MyColName');
});
I have a grid, which I want to add a button at the top to get the data from a specific column for each row selected in the grid. How would I go about doing this?
Add something like this to the button's click event:
rowsSelected = myGrid.getSelectionModel().getSelections();
for(...){
aRecord = rowsSelected[i];
filedValue = aRecord.get('fieldName');
}