I have a grid and a window with few textboxes and button.i want the values in row to appear in text box when window is opened on button click.i m able to alert a value of test function.
To get the selected row values you can use:
var records = Ext.getCmp('your_grid_id').getSelectionModel().getSelection(),
record = records.length === 1 ? records[0] : null;
alert(record.get('a_row_title'); // specified in the model
To set the value to a text field:
Ext.getCmp('your_textField_id').setValue(record.get('...'));
Related
I have a created a gridview and added a checkbox in item template. This grid has few columns along with DataKey (primary key). Due to performance gain, this grid will fetch the next set of recrods on each page change based on the page number click. So that is done.
Now when user selects a checkbox in page one and then go to page 2 and coming back to page one, then user will not see the checkbox checked as the user did earlier.
So is there a good way to persist the checkbox when user move page to page?
This checkbox be used as a flag to select the rows that can be deleted later by a button outside the grid.
Since you receive a new set each time a paging is selected, I suggest the following approach:
Create an array[] object via javascript that will add to list the datakey whenever a checkbox is selected and in turn remove it if the checkbox is deselected. Something like this:
var selectedDataKeys = [];
$('.checkboxclass').on('change', function() {
// Considering you assign the data key as id for the checkbox otherwise implement a way to retrieve the id.
var dataKey = $(this).prop('id');
// Determine if the dataKey is in the selected data keys array
var isContained = (selectedDataKeys.indexOf(dataKey) > -1 );
if($(this).is(':checked')) {
// If is contained is false - add to the array
if (!isContained)
selectedDataKeys.push(dataKey);
} else {
// If is contained is true - remove to the array
if (isContained){
selectedDataKeys = $.grep(selectedDataKeys, function(value) {
return value != dataKey;
});
}
}
});
From this point on the client user will have an active list of selected items, now its up to you to use that list to manipulate your grid display page. Either modify the display on document ready by comparing all the item on the grid display with the selectedDataKeys array or sending those keys and do the comparison server side.
Hope this helps.
I am working in extjs4. I have grid panel view as=
i want to show image in floating window whenever user clicks on grid row.So i have written function namely showImage() and calling it as=
me.mon(me, {'itemclick' : me.showImageViewer
}, me);
But i dont want to call this function when user clicks on FileName column of grid. So how to restrict calling showImage function when user clicks on grid column 'FileName'
You can listen to the column click function. Define common listener for columns you need. In arguments you should recieve grid, cell element, row index, column index, event data and record(in such order). So if you'll move, rename headers or do whatever you want with column with such listener it wouldn't change click listener.
i want to show image in floating window whenever user clicks on grid row.
Do you mean you'll show a popup containing the bigger image if image on row is clicked? if yes, on your showImageViewer function, you have to check the attributes of the cell if it's an image or you can check its dataIndex.
You can also listen to cellClick instead of itemClick. With that, you can check the cellIndex of the cell being clicked. In your case, if cellIndex is equal to 2 (index of your FileName column, don't call showImageViewer.
cellClick : function(view, cell, cellIndex, record, row, rowIndex, e) {
}
You can use a css selector to differentiate between elements inside the row, using a code like the following
listeners: {
itemclick: {
fn: function (view, record, item, index, e, eOpts) {
var photo = e.getTarget('.photo');
if(photo) {
alert(record.get('photo'));
}
}
}
You can try a working sample here. Hope it helps to solve your problem
I have a data table with 2 detail rows. In certain cases I want to show the first detail row and in some cases I want to show the 2nd. Something like:
if (row["field"] == "N") {
hideRow1();
}
else {
hideRow2();
}
In the layout tab in BIRT Report Designer, select the first detail row (so that it is higlighted).
In the Properties tab of the Property editor for the row, select the Visibility section:
Check the Hide Element checkbox;
Click the fx button next to the Expression, and enter a formula like: row["field"] == 'N'.
Repeat the process for the second detail row with a formula like: row["field"] != 'N'.
I have created a kendo.data.dataSource without transport (only data with model and fields) with success, and I am able to bind it to the KendoUI Grid on my page.
After loading, the grid is empty. I do calling the net line to add a empty data item in the grid so the user can enter data directly in the grid (inline mode).
$("#divid").data("kendoGrid").addRow();
This all works.
But after the user finished the input and hit the OK/Save button, I like to add a new empty row immediatly, below the previous added row. I try this during the grid function Save:
save: function(e) {
$("#divid").data("kendoGrid").addRow();
}
But the previous row with inserted data disappear and a new empty dataitem isn't added.
Also trying this same way during the datasource event 'change', but with the same behaviour.
My question is, what I doing wrong or what is the best way to add a new empty row to the Kendo Grid when user hits the OK/save button of a current inine editing row.
If you want to save multiple record at a time, you can go for batch editing. You can bind a keypress event to create new row as well. Try this:
$(document.body).keypress(function (e) {
if (e.keyCode == 13) {
var grid = $("#grid").data("kendoGrid");
grid.addRow();
}
});
13 is the value for enter key.
I have dynamically created a table in asp.net and Each cell in a row contains Option Button and Text Box respectively.The Option Buttons in a row are grouped.So,Only one Option Button Can be selected in a row.My Table contains m columns and n rows.
Now i want to get the selected Option Button value in each row when the form is submitted.
Above Table Contains 3 rows and 4 columns.
row :1 -> contains header.
row :2 ->[2,0] is a option button,[2,1] is a text box,[2,2] is a Option,[2,3] is Text Box
.
.
.
Last Row -> is a sumbit button.
So Now i want to get the selected options button value of each row when submit button is pressed.
Please guide me to get out of this issue...
Try something like this
Note: Here tbl is an instance of HtmlTable control
foreach (TableRow row in tbl.Rows)
{
foreach (TableCell cell in r.Cells)
{
RadioButton r = c.FindControl("radiobuttonID");
// find your radiobutton & get needed values from that
}
}