How to get the cell value of listview - javascript

I can not get the cell value of my Telerik asp.net listview control.I want to know how to get the cell value of any listview control .Each cell of my listview control contain Image and one check box .I want the cell value by clicking the on back end i mean in C# code.

I'm not sure exactly what you want here, but to get a checkbox control inside a GridItem would look something like this.
GridItem Item = listview.Items[i];
bool isChecked = ((CheckBox)Item.Controls[0]).Checked;
See the Telerik Doco for more information.

If you wired the OnCheckedChanged event of the textbox, the NamingContainer inside its handler should point to the listview item which hosts it. Then if you call the FindControl method for the listview item that has label with text inside it, you should be able to fetch the text from the label.
Dick

Related

Kendo UI inline editing with dynamically change editor

I have two columns in this demo
Setting Type (which has drop-down list)
Editor (it contains the value of column)
I want to change the the Editor column when drop-down list value is changed (from Setting Type column). Example, if a user selects date from drop-down list, the Editor column field should change to date picker.
Can anyone help me to solve this problem? I've been stuck with this for a week. Appreciate your help. Here's a demo: DEMO IN DOJO
One option is to switch to incell edit mode (https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/configuration/editable) so that when the editor for the settingDefaultValue is created, the value of settingType is set.
The second option is to bind to the change event of the typeEditor and re-create the editor for settingDefaultValue. Currently, I don't think the grid.refresh() will even be fired, since the grid has a row open for edition. In the typeEditor change event, e.sender will give you the kendoDropDownList, and something like e.sender.element.closest("tr").find("td:nth-child(2)") will give you the container to put the editor in.
One more remark: use either data-bind="value:YourFieldHere", or a change handler with options.model.set("YourFieldHere", this.value()), but you don't need to do both - setting the YourFieldHere is literally what the value binding does.

Select data from dropdownlist each time and add them into gridview using javascript

suppose that I have a dropdownlist of 20 items and a button beside the dropdownlist(lets name it "Add") and also I have a gridview of empty items at first.
Now what I want to do is that whenever I select an item from dropdownlist and hit the button("Add") the selected item will bind into the gridview.If I select 5 items at 5 times from dropdownlist,5 data will bind to the gridview.I mean each time I select the data from dropdownlist and hit the button the data will bind to the grid view.I want to that in the front end using jquery or javascript
And after adding or binding the data into the gridview I want to save this data into db.
Is it possible using javascript or jquery??
You should be able to use jQuery to append html to your gridview. When a gridview is rendered, it is just a <table>, so adding a new <tr> and however many <td> you need should work.
$('#gridView').append("<tr><td>Yourddl.value</td></tr>");

Callback for Yii2's GridView CheckboxColumn

I have a GridView (Yii2) and one of the columns is a boolean type of data. I want to be able to toggle that value and have it saved in my database.
I need a callback for that, but I don't see CheckboxColumn having one. How can I achieve this?
Don't go looking too far. Just use the checkboxOptions-property of your column setup to add a specific class to all checkboxes. Then you can use a jQuery event to listen to changes and report them back:
$('.checkbox-column').change(function(e) {
var checked = $(this).is(':checked');
$.ajax('route/target', {data: {id: $(this).closest('tr').data('key'), checked: checked}});
});
Yii's GridView normally renders a data-key-attribute for every row (on the <tr>) that you can use to identify the actual record to update.
As an alternative: $('input:checkbox', $('#w0')).change() could also work, assuming you don't want the extra class and that the GridView is your first widget.
All the GridView column can have a callback function. you can set the value attribute of the every singole column with result of the callback function.

Passing value of select list through Jquery in Oracle Apex 4.2

The following classic report which when we select specific row pops up with new modal region called addExtraDetails with some data grabbed from row and some new additional info required from user:
When (+) is being clicked the new modal region pops up, with populated values taken from the report row. So: in Column link I put:
javascript:function_to_add_to_basket('E',#ID#, 'Extra#ROWNUM#', #PRICE#,'DUMMY');
Then external js function is responsible for passing information. The problem is it does not refresh every time (+) is populated instead it keeps values of the first input.
I found better solution(and cleaner), upon clicking (+) Column Link is passing:
javascript:$s('P4_SET_QUANTITY','#QUANTITY#');
javascript:$s('P4_SET_TYPE','E');
javascript:$s('P4_SET_OBJECT_ID','#ID#');
javascript:$s('P4_SET_ELEMENT_ID','Extra#ROWNUM#');
javascript:$s('P4_SET_COST','#PRICE#');
javascript:$s('P4_SET_DISCOUNT','DUMMY');
javascript:openModal('addExtraDetails');
Now it updates everytime when we select various rows HOWEVER since we have dropdown javascript grabs all possible value of Quantity column so for this code:
javascript:$s('P4_SET_QUANTITY','#QUANTITY#');
the output is: '012345678910'.
How can I pass all values to modal region and make it to work with new values every time its being called ?
You need to retrieve the value of the select list when you click the modal button. The value is not static, unlike the other values. The substitution strings are replaced with their value when the page is rendered.
It isn't really necessary to do all those item sets if all you want to do is use them in a javascript function. Your first idea was probably just as good but I'll just run with openModal.
First, determine how to target the select list. You did not specify whether your report is a wizard-generated tabular form or a manual tabular form (ie used apex_item to make the select list). You could either target the select list by the name attribute, which refers to an array, or select by header of the column. Also see this article.
Eg, with the column name for the select list being QUANTITY, selecting the list would be:
td[headers=QUANTITY] select:visible
Alternatively, if you determine the array you can be more precise in targetting the element. Eg if the NAME attribute is set to f02 then you could select the select lists with
input[name=f02]
Then modify the openModal function to select the list value on the same row as pThis - which would be the triggering element, the anchor :
function openModal(pThis, pMethod){
//fetch the value of the select list on the same row
//I use the second method of selecting here
var lListValue = $(pThis).closest('tr').find('input[name=f02]').val();
...
}
You'll also need to adjust your call to openModal:
javascript:openModal(this, 'addExtraDetails');

How to edit row of Telerik MVC grid in Javascript

I am trying to edit a cell's innerText property. The text is shown in the table but the problem is that the row isn't being marked as updated, so when I press my "Save Changes" button the update method doesn't get this row (in the list of rows to update).
I am trying to use this method (updateRow) but so far it has been unsuccessful:
var grid = ("#grid").data("tGrid");
var rowToUpdate = grid.data[0];
rowToUpdate.quantity = 4;
grid.updateRow(rowToUpdate);
When the method is called I get the following exception:
"object does not support this property or method".
in the source of telerik. Does anyone know how to mark a row as updated? Or a better way to update the value of cell in row?
You can use the client-side method updateRow to force updating. The key is selecting the table row you wish to update, as indicated in their example (of course, you don't have to use their $('#Grid .t-grid-edit-row') selector; you can use any selector, so long as it selects the row you wish to update). I believe that your modifying of the cell's innerHTML/innerText to communicate the new value is how its done.

Categories