Vue datatable row q-input not persisting values of model object - vue.js

Please refer to the azure link for the built code and github link for the source code. To explain the scenario, I have a q-datatable from Quasar Framework. Since I have nested data, I am populating primary data in a collapsible for loop and secondary data in the content of collapsible as a datatable. The page also features an Edit/View Mode toggle just below the filters on the right. I have formatted the columns of the datatable to show q-input when in Edit Mode and just text in View Mode. Please do the following operation to reproduce the error. Steps 5 and onward are the steps producing unexpected behavior.
Expand one of the rows at the link(open in new window manually).
Toggle the Edit/View toggle which can be found just below the filters.
Trying editing any row. Observed Result: The values do persist in the text boxes on leaving focus, and also in the labels when page mode is changed back to View mode.
Add a new row by clicking on Add button found just below the row header.
Try typing in any of the text boxes in the newly added row and move to the ext text box. Observed Result: The values do not persist in the text box neither do they show in the labels when changed to View Mode.
Change mode back to View Mode and then back to Edit Mode. Observed Result: Values do show in the text boxes in edit mode but not in the View Mode.
Add a new row. Observed Result: Now the previously added row values show in both Edit and View Modes.

The problem was in the AddRow method. It is stated in the documentation that vue can only track changes to objects with defined properties. In the AddRow method I was adding an empty data object to the model. Adding properties with null values fixed the issue.

Related

Radio buttons used in a rad grid in batch edit mode

I am trying to find any information about using a radio button in a rad grid in batch edit mode. I have created a template column, then added the radio button control, but it doesn't work in batch edit mode (nothing saves back to the DB). Is it even possible? I can't find anything on the Telerik site so I am suspecting its not supported. Thanks.
The Radio list is not supported in the batch editing mode. Such integration simply has not been implemented. The closest available option at this time is using a dropdown list: http://demos.telerik.com/aspnet-ajax/grid/examples/data-editing/batch-editing/defaultcs.aspx. Generally speaking, the standard way of editing boolean fields is through a checkbox column and not a radio button list - check the Discontinued checkboxes column.
What the grid does is that it loops through the controls with JS code when cells are opened and closed and determines control types and the proper API to use (e.g., $get().control.get_value() for dropdownlists, or $get().value for standard inputs). You can try implementing similar logic in the batch editing events.
You can try to use a RadRadioButtonList with the two items declared in its markup and its client-side API (see the get_selectedIndex() and set_selectedIndex() method: https://docs.telerik.com/devtools/aspnet-ajax/controls/radiobuttonlist/client-side-programming/radiobuttonlist-object) together with the following approach of working with templates: https://docs.telerik.com/devtools/aspnet-ajax/controls/grid/data-editing/edit-mode/batch-editing/working-with-templates.
The idea is to have the radio button list in the edit template of the column and to select the correct item in it according to the newly opened cell value on the client, then fetch the selected item from the button list and put it in the grid data source.
You can find one example that you can try using as base in the following thread: https://www.telerik.com/forums/radiobuttonlist-in-gridtemplatecolumn.
Showing a radio button list in the item template is also something that is not supported, as the editing would basically happen in the "display" mode of the cell, and not in the edit mode of the cell. You could try using the server ItemDataBound event and FindControl() (see here: https://docs.telerik.com/devtools/aspnet-ajax/controls/grid/rows/accessing-cells-and-rows#accessing-controls-in-template-column) may let you set initial values based on the data source for the radio button lists without data binding them. Then, perhaps a hidden field or hidden checkbox can be used for the actual data binding (see the template article above). You could also try using the batch editing manager changeCellValue() method on the client-side events of the radio button list, in a fashion similar to this article: https://docs.telerik.com/devtools/aspnet-ajax/controls/grid/data-editing/edit-mode/batch-editing/how-to/editing-checkboxes.
Another approach you can consider is to use the client-side events of the radio button list and immediately upon change to call a service that will update the database. This may simplify the template handling logic (you could do this in a read-only column) but it goes against the purpose of batch editing to invoke one request with a lot of data, and you would also need to secure the service.
Another online resource to check is
https://docs.telerik.com/devtools/aspnet-ajax/controls/grid/data-editing/edit-mode/batch-editing/how-to/editing-checkboxes

How Do I Expand A Cell in MUI-Datatables to display additional content?

I want a user to be able to click a row in the MUI-Datatable, so they can see additional content. The current renderExpandableRow function has the right styling, but I don't want a new row. I want the cell in the first column to show additional data. Is there a way to do this?
Note: I'm also going to need buttons that will expand all/collapse all, so I need a solution flexible enough to do that.
I found a solution to my question.
I made the first column's content a Button using customBodyRender. The column with expandable content became the second column. This column has a customBodyRender with a Collapse component. I store in my component's state all ids of my data objects and whether or not they are expanded. When the Button is clicked, my component's state is updated, which in turn changes whether or not the Collapse component is open.
I also used customToolbar in the table options to generate an expand all/collapse all button, which just sets the state of all rows to expanded/collapsed.

Rendering components are showing up twice when clicked on Add Here button in Sitecore Experience editor

In experience editor, whenever clicking on "Add here" button, getting duplicate entries of renderings.
Below is the image for reference. I am using Sitecore 8.2
Use Rendering id's to see if the both are same or different. Add the two renderings to the item in two different placeholders and then check the raw values in the presentation details of the item.
1.If both are same, Then it is caching issue. just clear the cache.
2.If both are different, then there is rendering available with the same name. If it is a duplicate then copy the rendering id from the presentation details and search it in the sitecore content tree and once you have a hit. delete it.

FormGroup still have controls although deleted dynamically

We have angular page with structure of Left bar (Say Component A), Main content (Say Component B)and right side bar (Say Component C).
Under Left bar , we have dynamically added custom controls. Custom control has say 2 textbox (with validations) and a button. There is button called "Delete" under each control so that that control would be deleted if clicked.
Right Side bar has button say "Save" . Once user clicks on it validation do get fired (if applicable) or saves data.
Issue:
Lets Say I have 5 controls on Left side bar. Lets say their names are ctrl01,ctrl02,ctrl03,ctrl04,ctrl05
When I click on delete button of ctrl02 , It gets Deleted. and then FormGroup has only 4 records ctrl01,ctrl03,ctrl04,ctrl05 and so is UI
However when I Delete ctrl03/ctrl04/ctrl05 the object are Deleted from UI but FormGroup still has ctrl01,ctrl02,ctrl03,ctrl04,ctrl05.
So, Application doesn't Save data for ctrl01 as Validation gets fired for controls which are deleted(ctrl03,ctrl04,ctrl05) but still part of FormGroup.
Please note this issue occurs only after Deleting 2nd and onwards controls .For First it works fine.
I also checked if Object holding all these records is properly updated or not after Deleting. It is updating properly. That's why UI shows correct number of Custom controls. Its just FormGroup which is causing this issue.

Save databound table information spread across 3 tabs vb.net

I have a Windows form with a tab control on it. I have fields from one bindingsource on 3 tabs of the tab control. I can open the form and change data on all 3 tabs and navigate between tabs and my changes are there. When I click on the 'Save' button on the BindingNaviator, not all of my changes are saved to the table I am bound to. Is there something special that needs to be done to not lose the changes?
I found the issue. On Tab2 of my tab control I have some number fields. There is also a checkbox the user can select to set those number fields to 100, and if they uncheck it, it was setting the the .text property of those to "". The fields should be set to 0 instead of a blank. After I made this change, it works fine. Thanks for the help.