kendo grid dataitem , how do i get items that are objects - javascript

I am trying to populate a Kendo list box from a kendo grid selection. The way it should work is that when a user selects the row a column in the grid will display that item in the list box. The problem I am having is that I cannot access the object in the dataitem I want to use. the object is visible and the fields inside it are correct I just need to be able to send that object to a list box where it looks for the valuefield and textfield.
I have been searching for a solution for a few days now. I am wondering really what I should be searching for at this point. I cant figure out what it is that will allow me to pull this object out of the dataItem to use it in my list box.The dataItem is [object(anonymous function)],The object inside the dataItem is:RolesLists [object(init)]. It is the RolesLists that I need to retrieve and send to the List Box. Nothing works as dataItem.RolesLists stays undefined.
I get the grid data in the grid , and I get the list box to send the data to in the second line. I then get the dataItem from the grid which gives me everything selected. I remove anything currently in the list box.Finally I add the dataItem, which should be dataitem.RolesLists. That comes up as undefined.
var grid = $('#grid').data('kendoGrid');
var listboxSelected = $('#selected').data('kendoListBox');
var dataItem = this.dataItem(grid.select());
listboxSelected.remove(listboxSelected.items());
listboxSelected.add(dataItem);

Well I figured it out I was making an error , my apologies for wasting everyones time. The code above was correct and you can use it if you wish to retrieve an item from a Kendo grid and populate any element with it.

Related

How to dynamically transfer values from a drop down list to a DataTable?

I'm not really sure how to dynamically transfer the values from a DropDown list to a jquery DataTable in a way that when i choose a value from the list that once transfered doesn't appear in the DropDown list anymore, but if i remove it from the datatable that it appears back. The DropDown list is populated with the users from a database table and each user has his own id. I need the list values to not appear in the view, the backend is ok, i was thinking it could be done with javascript but i'm not sure how.
I don't have any code as i don't have the slightest idea as to how to make it, i'm still rather new to coding so any help is welcome.
It's pretty easy if I understood your question properly.
Add a class to your column where you want to display the value after change from drop down. For example,
//my rest code for DataTable
"columns": [
{
"render": function (data, type, row) {
return "<input type='text' class='myDropDownValue'>";
}
},
//Rest columns
In DropDown change event just render the value to this class, like bellow,
$('#myDropDown').change(function(){
var myValue = $(this).val();
//here we can render this value to data table row
$('.myDropDownValue').html('');
$('.myDropDownValue').val(myValue);
})
That's it!

How to get first-child sibling without using detailinit function in Kendo Hierarchy grid?

I used Hierarchy grid to my web page. In hereI used print Button on each row to print row data. But now I can`t get first-child data by using this code .
var dataItem = $(e.target).closest('td').siblings(':first-child').text();
How can I get first column data.
If you wamt tp access the master record from the details Grid, the easies way would be keeping information about the parent (for example the id) and then use it.
Said so, if you want to use HTML - DOM for getting it, what you have to do is:
First, find the row that contains the Details Grid in the Master Grid
var row = $(e.target).closest(".k-detail-row");
Next, find the previous sibling (the row that contains the master record)
var master = myRow.prev();
And now you can get either the data in the model or the text from the Grid but you should remember that the first cell in the master row is the handler for collapsing / expanding the details
var item = grid.dataItem(master);
var text = master.find("td:nth(1)");
A running example here : http://jsfiddle.net/OnaBai/Wzr46/2/

SlickGrid V2.0 Column name/id does not follow column when dragging

I have an application (using SlickGrid) where I need to get the column name or id at any time when user clicks on a cell (this pulls up a menu specific to the data in that column/cell). Grid works fine initially but if the column is moved (drag/drop), the column name/id does not follow the drop but remains mapped to it's initial column position.
Has anyone else seen this and, if so, how did you fix it?
Thanks
Are you trying to reuse the list of columns defined in your html code? You should get the list of columns from the grid instead. The following code should do what you are expecting (i.e. printout the name of the column in which you clicked a cell):
grid.onClick.subscribe(function(e,args) {
var allColumns=grid.getColumns();
console.log(allColumns[args.cell].name);
});
You can add that code in one of the examples provided with the source code (say "example3-editing.html"), drag-drop some columns around and check the console after clicking on a cell.

How to get the cell value of listview

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

How to add a row below the currently selected row (based on a dropdown input) using jQuery?

I have a table with a bunch of rows. In the last column of every row, there is a dropdown. When the dropdown changes, I need a new table row to appear below the row where the user selected the dropdown item. However, I also need the new row to have different data depending on what was selected in the dropdown.
Is any of this possible using only jQuery?
Note that I'm using ASP.NET for back-end development, so if a solution can be found without using ID's that would be great.
$("table select").live("click",function(){
var row=$(this).parent().parent();//add some .parent() untill you get the TR element
var val=$(this).val(); //<select> value if you want to use it for some conditions
$("<tr><td>....</td></tr>").insertAfter(row);
})
It's simple enough to add the HTML using JQuery. However, if you intend to save this data back to the server, the default ASP.NET process (using ViewState) will ignore the new rows. Instead, you would need to directly read the submitted form properties.
To learn how to add a row, look at the suggestions here: How to add a new row to a specified table with jQuery?

Categories