After seeing my question/answer on this topic, finally I decide to put this question,
from Controller side, I am returning a Data Table with dynamic number of columns (not fix at design time, it will give columns at run time).
want to bind that Data Table to jquery grid.
Please suggest and help....
I check this solution, but how to do with MVC?
Is it possible to modify the colModel after data has loaded with jqgrid?
Check this if this will solve your problem. This might be slow but it will work.
#foreach (System.Data.DataRow row in Model.Table.Rows)
{
<tr>
#foreach (System.Data.DataColumn col in Model.Table.Columns)
{
<td>
#Model.Table.Rows[row.Table.Rows.IndexOf(row)][col.ColumnName].ToString()
</td>
}
</tr>
}
Related
How to handle row selected changed event for a table using Blazor?
I tried handling #onchange as well as #onselectionchange.
The syntax for the table looks like this:
<table class="table" #onchange="#this.SelectionChanged">
Your event binding doesn't work because the table element does not emit change events.
Instead, you could add an input element (for example a checkbox) inside your table rows. You can then handle row selection changes by adding your event binding to the input elements.
Read more on the HTMLElement change event in this article.
You can use Onclick in the row:
<tbody>
#foreach (var item in Forecasts)
{
<tr class="#item.Clase" #onclick="#(() => DoSomething(item))">
<td>#item.Date</td>
<td>#item.TemperatureC</td>
<td>#item.TemperatureF</td>
<td>#item.Summary</td>
</tr>
}
</tbody>
and create a Dosomething to receive the item
I'm using Knockout for data binding and using dataTable+YADCF for Sorting and filtering. My scenario is little complex, on clicking the Category nodes (left side) each time need to make an AJAX call and refresh the table data (right side) through Knockout. This Knockout binding functionality works fine without any issue.
HTML Code
<table class="pdm-data-table pdmList" id="ListCatAttrVal" data-link="row">
<thead>
<tr>
<th>Display Name</th>
<th>Display Source</th>
</tr>
</thead>
<tbody id="listAttribute" data-bind="foreach: attributevalue">
<tr>
<td data-bind="text: dispName"></td>
<td data-bind="text: dispSrc"></td>
</tr>
</table>
Knockout Model Code
if (!ko.dataFor(document.getElementById("listAttribute"))) {
var attributeModel = function () {
this.attributevalue = ko.observableArray();
};
attributeBinding = new attributeModel();
ko.applyBindings(attributeBinding, document.getElementById("listAttribute"));
}
Issue is after applying DataTable for the Table
$("#ListCatAttrVal").dataTable().fnClearTable();
for (var x in response.attributes) {
attributeBinding.attributevalue.push(response.attributes[x]);
}
$("#ListCatAttrVal").dataTable();
After this, Datatable Sorting is not working.
I'm trying to remove the existing generated dataTable and re-initiate it every-time when I click on the category node. But it is not working as expected.
I had a similar issue while working with knockout and datatables - my bindings inside the datatable don't seem to work initially. As a workaround I ended up initialising the datatable in the following way:
var table = $("#ListCatAttrVal").dataTable();
table.fnPageChange(0, true);
After calling fnPageChange (or any other function of datatable library, I believe) bindings seem to be working.
All -
I'm using stripes to do some form input for a problem I'm working on and I'm stuck on how best to submit a a pair of data using stripes and checkboxes.. for example my page looks like the following:
I have a list of options where users can enable a selection by clicking the box, and also supply some input for that item by entering data into the text field next to it:
<tr>
<td><stripes:checkbox name="item.enable" value="${item.id}"/></td>
<td><stripes:text name="item.value" value="${item.value}"/></td>
</tr>
.....
next item...
When the form is submitted I'd expect my Collection<Item> to be populated yet that's not the case..
How can I best submit a pair of items using the check box fields.
Thanks in advance.
..Chris
Read the documentation on indexed properties. You need to tell Stripes that you have multiple items, by naming them items[0], items[1], etc.:
<tr>
<td><stripes:checkbox name="items[0].enable" value="${item.id}"/></td>
<td><stripes:text name="items[0].value" value="${item.value}"/></td>
</tr>
<tr>
<td><stripes:checkbox name="items[1].enable" value="${item.id}"/></td>
<td><stripes:text name="items[1].value" value="${item.value}"/></td>
</tr>
This supposes that you action bean has a setItems(List<Item> items) method, that the Item class has a public no-arg constructor, and has a setEnable(String itemId) and a setValue(String value) method.
I would wrap this in a JSTL 'forEach' tag and I would put the items in a List. Similar to what JB Nizet said, you also need public setters in the action bean. If you are using Collection<Item> with some implementation other than List<Item> the below snippet won't work.
<c:forEach var='itemIndex' begin='0' end='2'>
<c:set scope='page' var='item' value='${items[itemIndex]}'>
<tr>
<td><stripes:checkbox name="items[${itemIndex}].enable" value="${item.id}"/></td>
<td><stripes:text name="items[${itemIndex}].value" value="${item.value}"/></td>
</tr>
</c:forEach>
There is another case when you don't want the list to default to 3 items. The one I'm thinking of is when the list is already populated. If that is the case I would change the 'end' attribute of the <c:forEach> to be: ${fn:length(actionBean.items) == 0 ? 3 : fn:length(actionBean.items)-1}
I have a Model containing many rows. One of the columns in the row shows the datastore location. What I would like to do is to have a table of data for each datastore location. Is there some simple way I could do this with Razor? Here's a simplified example of what I have.
<table>
#foreach (var item in Model) {
<tr>
<td>#item.Datastore</td>
<td>#item.xxx</td>
<td>#item.yyy</td>
</tr>
}
</table>
If you haven't got the list of individual data sources available to you in your model you will have to extract them directly from you model. You can do this using Linq and using the Distinct method to find the unique values.
Once you have those you can then loop through the list and create individual table for each data store and populate them using filtered values from your model based on the data store value.
Something like this should work:
#{
var dataStores = Model.Select(i => i.DataStore).Distict();
foreach(var dataStore in dataStores) {
<table>
#foreach (var item in Model.Where(i => i.DataStore == dataStore)) {
<tr>
<td>#item.Datastore</td>
<td>#item.xxx</td>
<td>#item.yyy</td>
</tr>
}
</table>
}
}
I need to replicate the functionality you get with an asp repeater that contains checkboxes, textboxes, and the occasional dropdownlist in an MVC application. Om traditional webforms you get a postback event and its pretty easy to get at all the controls and their values associated with the checkbox (id).
Anybody have any good suggestions on how to get the values back on a post for the items that have the checkbox checked. I am able to get some arrays back in the FormCollection (and even a strongly typed view) but I have not been able to figure out a good way to link the values effectivly.
All rows have a checkbox and a textbox, some rows also have a dropdownlist
To further explain...
row 1 has a checkbox and a textbox
row 2 has a checkbox a textbox, and a dropdown list.
if the user selects row 1 and 2, I need to get the values for all the form elements (for some calculations). Also, I haven't come up with a good method of handling validation errors.
any suggestions are greatly appreciated.
The simplest thing to do would be to iterate the collection for which you would have a repeater for. Using Razor syntax:
#using (Html.BeginForm()) {
<table>
#for (var i = 0; i < Models.Items.Count; i++) {
<tr>
<td>
#Html.CheckBoxFor(x => Model.Items[i].SomeBool)
</td>
<td>
#Html.TextBoxFor(x => Model.Items[i].SomeString)
</td>
</tr>
}
</table>
<button type="submit">Go</button>
}
Then a controller method:
[HttpPost]
public ActionResult Index(MyViewModel viewModel) {
// view model will be bound to values in form
}
Assuming the the Model in the view is of type MyViewModel. Once you have a sense of how this works you can look into ASP.NET MVC grid frameworks.