I have two GridViews that list out included and exclude data items respectively.
By clicking "Change Status" (a custom button for each row) Users can change the row status from included to excluded or vice versa.
However before changing the status - users would need to specify the reason and enter a date for when they want something included/excluded. So these are additional operations that need to take place after the "Change Status" button is clicked and before an update occurs.
I want to use jQuery to capture the row id being "changed", save this value and pass back the update to the database.
I will use an absolute div for the menu but I'm running into issues as to how to capture row id and how to pass this back to my C# in codebehind.
I would have a modal dialog to capture the reason and date when the user clicks the "Change" button. On each row, next to the button include a hidden field that contains the row ID, or better yet the key for the record in the db. Then when you launch your modal, use jQuery to select the hidden field next to the button to grab the key value, and submit it as part of your modal form.
the jQuery would look something like:
$(function() {
$(".changeButton").click(function() {
var rowId = $(this).siblings(":hidden").val();
$("#myModal input[name=rowId]").val( rowId );
// do modal popup
});
});
Related
The case:
I have Activities as datamodel.
I have set Activities to have many-to-many relationship with themselves to represent a Parent / Child relationship.
I have set up an accordion widget. Each row of the accordion contain basic data about the Activity record + some buttons.
I have set one of the button's onClick functions to open a popup, which allows me to edit the Activity detail in a form.
When I click a different record from the same accordion, the form from the popup reflects the data in the selected record.
The problem:
I have nested accordions which represent the "Child" Activities of the Parent Activity.
I have also added a similar button, which opens a popup. I can open the popup, which targets the child records, but cannot make it open the specific record, from which I pressed the button.
So the popup open by default on the first child.
Please help - how can I make the popup change naturally to reflect the datasource / selected record of even nested datasources?
What I tried:
In order to try and make to popup work I have tried to set the datasource based on the relationship:
Activities: Sub_Activities(relation)
This works to the extent of showing the related items, but popup content does not dynamically change on clicking a different child record or clicking the button from a different child record.
In both cases what is shown is the first child record.
What I understand is that you have a set up in which you click a button and a popup shows. The popup should let you view/edit the record referenced in the row where the button is. If that is the case, then probably you already have almost everything setup for the next thing to work. First, add a string custom property to the popup and name it selectedKey. Then, on the onClick event of the button that opens the popup, add something like this:
var key = widget.datasource.item._key;
app.popups.MYPOPUP.properties.selectedKey = key;
app.popups.MYPOPUP.visible = true;
Now, go to the popup content and add the following on the onAttach event handler:
var key = widget.root.properties.selectedKey;
widget.datasource.selectKey(key);
This is the general idea of how to make it work; However, in order for it to work, your datsources in the widgets should be properly set up. Good luck!
I have created a tabs widget that contains a table widget on the first tab. Whenever a record in the table widget is selected, the focus should switch from the first tab to the second tab as this contains more detailed data regarding the record. How can I implement such a script? Is there something like
app.currentpage.tabs.selectedtab = ...
To select second tab you can use this code snippet:
// Setting selected tab index to 1 since indices are zero-based.
app.currentPage.descendants.MyTabsWidgetName.selectedTab = 1;
This code can be placed in onClick event handler of the table's row.
I'm used to using boolean bindings with IBM buttons to track if a button is clicked. The button in Brazos UI can be bound to any variable type but doesn't make automatic updates to booleans. How do I use bindings with Brazos UI buttons to track which was last-clicked?
The binding of a button is really only useful in tables. The acceptance of ANY variable type for the binding of a button stems from the use of determining the index of a selected row or obtaining the entire row object:
If you bind and integer to the button in a table, the binding will update with the index of the row when the button is clicked.
If you bind a variable of the same (singular) type as the table's binding, then clicking the button will update the binding with that row's data.
Both of those are handy interactions with the table control but don't work for tracking which button is clicked when used elsewhere on a coach. For that, you want to utilize the 'Button Control ID' configuration option. The most direct method is to bind the same string variable to all of the buttons you need to track. When clicked, a button will update that shared variable to match its own control ID. You can then use that unique ID in various scripting checks to take button-specific actions.
See the BP3 Help Center article for greater detail about this, including some examples: https://support.bp-3.com/hc/en-us/articles/217985767-Using-Button-Binding-with-Brazos-UI
I am using RowEditor plugin for my grid. Grid record has three buttons: choose,update,cancel. When I click on choose it will display another grid and user has to click on one record, then some values of that record have to display on the previous grid. How to do this ?
I am using extjs 3.0
Thanks in advance!
When you click on choose - show a modal window popup with grid. When you open that popup pass a callback into constructor of the popup. Then force user to select only one record in grid (using rowselectmodel). On itemclick even of the child grid - call your callback and pass selected data in the parent grid. Update parent's grid record with this data.
Hope I was clear.
To figure out which row the user selected, use the Ext.grid.GridPanel's SelectionModel. The default model is Ext.grid.RowSelectionModel (use selModel config setting to change the default). To grab the selected row, call myGridPanel.getSelectionModel().getSelected(). That will return an Ext.data.Record. Dig into that data to populate the original grid/store.
Thanks for your reply. I have done the required things.
How I have done is, just passed the editor to my function and using selection model, I got the values and have placed them into the editor.
val1 = selectedArray[0].get('val1');
var cm = grid.colModel, fields = editor.items.items, f, val;
f = fields[1];
f.setValue(val1);
editor.values[f.id] = val;
This makes my life easier.
But, I have another problem, after placing into the editor. I have to do validation in the afteredit event, if user clicks the update button. In the afteredit event,
afteredit: function(object, changes, record, rowIndex)
{
// I have to do validation on the changes; but its an object. How will I do it
???
}
Is it possible to select multiple gridview rows using Ctrl+Click and then delete all the selected rows with a button?
You can have a hidden field on the page that gets updated with each row ID in some sort of delimited list. Using jQuery, you can easily add a click event to each row that will add the ID to the hidden field on the client. After clicking a bunch of rows, the hidden field might look something like "3,65,245,111"
Here is a bit of jQuery to get you started. This will assign a click event to each row of a table with the ID "myTable":
$(document).ready(function() {
$('#myTable tr').click(function() {
//Insert your code to handle the click event and assign the row value to your hidden textbox
});
});
The above will make it so that you can handle each time a row is clicked. You'll need to write a bit of code and be creative to figure out how to get the ID of the clicked row.
A separate "delete all rows" button would take the value in the hidden field, split the string at each comma and then delete each row one at a time.
There are lots of different ways to skin this cat and the above is a quick and simple way to get the job done.