I'm trying to get the row data from a table which is connected to a dataset. So as per the this article, since, I need the whole data of the selected row, I'm using OnCurrentIndexChange event handler to get the selected row's data from the dataset. But for some strange reason, the first row item will always be triggered on the load of the table/page.
Basically, the first row data will be selected on the load of the page/table. Is this a bug or am I doing something wrong?
Any help will be greatly appreciated.
Thanks,
Jilu
Though I couldn't get to work with OnCurrentIndexChange handler. But I found a work around by which I could fix this bug/issue for my application.
Solution:
Instead of using OnCurrentIndexChange handler of the dataset, I used OnSelectRow event handler to get the row index of the table and used that index to get the whole row data from the dataset. More on this get method, you can find here.
Below is the code for your reference:
export function tblCustomerList_rowSelect(event) {
$w("#dsCustomer").getItems(event.rowIndex, 1)
.then(result => {
let selectedRow = result.items[0];
console.log(selectedRow);
if (selectedRow !== null) {
let returnObj = {
"name": selectedRow.name,
"id": selectedRow._id
}
wixWindow.lightbox.close(returnObj);
}
})
}
Hope this will be helpful for people who are stuck with such kind of issue in wix.
Thanks,
Jilu
Related
There are many answers on how to clear the data from the similarly-named jqGrid, but I can't find any way to clear data from jsGrid. I just want to delete all rows and reset the grid to its default, with no rows.
I do see a Batch Delete method here, but it works with checkboxes and conditionals and I'm not seeing how to simply delete all rows unconditionally.
You can set data option to empty array:
$("jsGrid").jsGrid("option", "data", []);
The only thing that seems to work for me is
$("#jsGrid").jsGrid({
controller: {
loadData: function(filter) {
return [];
}
}
});
We need to return an empty array or object.
I hope this helps.
What worked without implications for me was
$(".jsgrid-grid-body").children().remove();
if I wanted to keep the headers to indicate that there simply aren't any rows, and
$("#jsGrid").children().remove();
if I wanted to remove the whole grid.
I have a problem with filtering events:
I use fullcalender in agendaDay-View
I use a drop-Down list to select a driver
I compare the name (it is a property of event-object) with the selected value
(this part is ok)
Then,
I remove all Events (.fullCalendar('removeEvents');)
Add the specific events
(add with renderEvents doesn't work proberly at the moment)
And now my problem appears:
For the first time it works, however, when I select another 'driver', the events are gone, because of the 'removeEvents'-Action before.
So, how can I solve this problem, that I can only display the filtered events and keep the other (actualley all events) to filter again for second, third n- time?
$('#' + id).fullCalendar('refetchEvents');
was the first idea, however, its brings all back and selected Issues were doubled (and so on).
I'm thankful for every hint.
Ok I think you can solve your problem with fullCalendar's eventRender function.
The function can also return false to completely cancel the rendering of the event.
Your event from events.json should have a property like 'driver_id'.
I would have select field instead of dropdown with option keys being driver ids, values - names or whatever. Lets say it's id would be 'driver_select'.
Then render events like this:
$('#calendar').fullCalendar({
//...
eventRender: function(event, element) {
//driver select should have default value assigned or else no events will be rendered
if ($("#driver_select").val() !== event.driver_id) {
return false; //do not render other driver events
}
}
//...
});
Handle select changes to update
$("#driver_select").off('change').on('change', function() {
$("#calendar").fullCalendar( 'refetchEvents' );
});
Another approach would be to show all drivers in a timeline. For that you can use FullCalendar Scheduler.
I can't figure out how to make my treeview filterable.
Looking at the demos on http://demos.telerik.com/kendo-ui/treeview/api
function DoSearch() {
var treeView = $("#ItemList").kendoTreeView().data("kendoTreeView");
var filterText = $("#search-value").val();
if (filterText !== "") {
treeView.dataSource.filter({
field: "text",
operator: "contains",
value: filterText
});
} else {
treeview.dataSource.filter({});
}
}
If I do the implementation, when using filter method I am loosing my treeview
Here a fiddle with my sample treeview the same way that I'm getting, not using datasource, the ASPNET server code return the list as appears on the fiddle, then by javascript call the kendoTreeView method.
Here's my fiddle
http://jsfiddle.net/mspasiuk/hw4j4qt2/
To put in a nutshell what I want to do is have a textbox, when I type or hit on a button using a 'contains' clause, the treeview only have to show the items who match the criteria, If the search box is empty show the original treeview.
I would appreciate any help. Thanks
Alright, I was dealing with the same issue and with the help of this post I managed to do it. So make sure you check the existing thread I gave the link for. Hope that helps.
onCellSelect : function(rowid, iCol, cellcontent) {
$('#caseHistoryGrid').dialog('close');
$('#Case_Id').val(jQuery("#case").jqGrid('getCell', rowid,'caseId'));
$('#visitId').val(jQuery("#case").jqGrid('getCell', rowid,'visitId'));
alert($('#visitId').val()
);
}
when i click any cell. i get First VisitID only.
what s my Fault.
Please help.
Thanks in Advance
in This Code Not Problem But i get data from database using Ajax in tese data is formate
id
.....
give id is Not Unique So it gives the same celll
The drag/drop column reordering is a great feature, but how do I prevent the users from moving particular (non-data) columns?
For example, I am using the Checkbox Selectors for my mutli-select Grid, but this column should always be locked to the left, while the other columns can be freely reordered.
I looked at the sortable demos on jQuery UI and modified the setupColumnReorder function in slick.grid.js to exclude certain items. By excluding the checkbox column I was able to prevent it from getting reordered, even by dragging other columns before it.
function setupColumnReorder() {
var checkBoxColumn = $headers.children([0]).attr('id');
$headers.sortable({
items: "div:not('.slick-resizable-handle','#"+checkBoxColumn+"')",
...
Since my checkbox column is always first, I just grab the id like so. A bit of a hack, but it worked.
I tried this:
function setupColumnReorder() {
var checkBoxColumn = $headers.children([0]).attr('id');
$headers.sortable({
items: "div:not('.slick-resizable-handle','#"+checkBoxColumn+"')",
...
but i had problems when dragging other columns before it. Then i tried this:
grid.onColumnsReordered.subscribe(function (e, args) {
if (myGridColumns[0].id != grid.getColumns()[0].id)
{
grid.setColumns(myGridColumns);
}
else
{
myGridColumns= grid.getColumns();
}
});
and it was just fine.