ASP .net MVC Jqgrid data binding - asp.net-mvc

I am using a jqgrid with a column named 'Comments'. My controller code returns data as follows:
var jsonData = new
{
rows=
....
....
select new
{
col1....
col2....
Comments = _Model.GetComments(id),
})
.......
.....
return Json(jsonData, JsonRequestBehavior.AllowGet);
}
_Model.GetComments(id) will return a ClientComments Object which has a few properties say CommentID, FirstName, MiddleName etc., which will be bound to each row in the grid
Now in my jqgrid I need to build a tool tip based on Comments column properties and for that I need to use the properties of my Comments in JQGrid for each row. May I know How I can manipulate Comment's properties for each row? Any help would be appreciated.
I tried in my javascript that for each row rowObject.Comments.FirstName and it did not work.

For the JavaScript version of the grid you would use getDataIDs to get the ID of each row, and then use getRowData to read the data at that row. For example:
var ids = $("#grid").getDataIDs();
for(var i=0; i<ids.length;i++){
var rowdata = $("#grid").getRowData(ids[i]);
// Build tooltip here using rowdata.FirstName, rowdata.MiddleName, etc.
}
But, are you working with the JavaScript version of jqGrid or jqGrid ASP.NET component?

Related

Updating list in view Asp.net mvc razor

I have 2 lists in a view. What I want to do is that pick elements from list1 and update list2 with selected elements everytime I pick one. I tried to use PartialView (I don't know if it's correct approach or not) but I failed. I have a function in controller that fills a list by selected items. What needs to be done is updating the view dynamically. Can you suggest me a roadmap for this?
Update
I forgot to say that I have done this with javascript. But I feel like it's the long way when it comes to some validations (checking duplications etc.)
$(document).ready(function (){
$("#allPlayersList a").on("click", function () {
var options = $(this).clone();
$("#thisWeekList").append(options);
});
});
Just create an html list. See if this link helps. https://codepen.io/alexander-holman/pen/QNQrvz. You can also populate the values from database
Then you can get the selected element by javascript like this
var input = document.getElementById('Something').value;
Update after edited question
You can try something like
var listSelection = document.getElementById('Something').value;
Now you can create an api in the backend which accepts this value and returns a list based on it. Call that Api like this
&.ajax({
url: //url of api
data: {exactNameOfApiParameter : listSelection },
success: function(data){
for (i = 0; i < data.length; i++) {
$('<li>', { text: data[i] }).appendTo($('#list2'));
}
}
})
Make sure that id of second list is list2.

Validation issues in cloned row in table

I have cloned row form existing row in a table,i have gave validations for first row using jquery.validate.unobtrusive but it is not working properly for cloned row
You can use jQuery in your view and validate for client site.
For example if you have table you can use scripts some like:
Before form submit you can use:
var filterTable = $('#tableID').find('tr').length;
if (filterTable != 1) {
CheckFilterNameField(); // Use function
}
This function
function CheckFilterNameField() {
var $namefield = $('.filterPanel tr .namefield');
$namefield.each(function () {
if ("your conditions")
$(this).addClass('error');
else
$(this).removeClass('error');
});
}
If you will be have class error on the element in your table page can't load and in the specific item for example will be red or you can show alert about error in your form.

Displaying data in a MVC Web Page when the number of columns are not fixed?

I want to display the data in a Razor View in MVC from a customized datatype ('User' here) stored as a generic list. how to display that? the number of columns may vary, Is there a way to do this?
My code:
[HttpPost]
public ActionResult GetData(DataDTO data, FormCollection fc)
{
string server = fc["CategoryName"].ToString();
//"ctsintbmvodiaf1"
string cacheName = data.CacheName;
//"1CPlatformCache";
string keyName = data.KeyName;
//"UserContext_311581";
try
{
DataDAO.Initialize(server, cacheName);
var outPutData = DataDAO.dataCache.Get(keyName);
if (outPutData != null)
{
if (keyName.Contains("UserContext_"))
{
var ucOutput = (CTS.OneCognizant.Platform.Caching.User)outPutData;
CTS.OneCognizant.Platform.Caching.User userData = (CTS.OneCognizant.Platform.Caching.User)outPutData;
List<User> _user = new List<User>();
_user.Add(userData);
return View(_user);
}
}
}
}
You can try out the WebGrid HTML Helper that ships since ASP.NET MVC 3. Check out this blog post that shows how to use it. You can use it to easily render a grid of an "unknown" list.
You mention that you've used ASP.NET Web Forms databinding before, so if you imagine a simple GridView or DataGrid control, the WebGrid HTML Helper is fairly similar to that. A big difference is that the WebGrid helper does not have automatic edit/delete/insert support, so keep that difference in mind.

ASP.NET / MVC HTML ActionLink - how to pass returned Javascript value to ActionLink routeValue parm?

(target framework is 4.0)
I am implementing a feature to delete multiple records in a simple table. In order to do this, I am using simple HTML checkboxes with a Javascript function to loop through each one to find which are selected. The Javascript is returning an array of int values representing the record IDs to delete.
I am using an ActionLink to call all of this, and to ultimately return to the Delete function (with an int array as a parm) in my controller file to actually submit the deletions to the database.
My problem is, I don't know how to take the array I get back from the Javascript to place into the ActionLink, to pass it into the controller.
Here is the code with which I am working:
<p>
#Html.ActionLink("Add New", "Add") | #Html.ActionLink("Delete Selected", "Delete", new { id = "???" }, new { onclick = "return getProjectsToDelete()" })
</p>
<script type="text/javascript">
function getProjectsToDelete() {
var answer = confirm("Are you sure you wish to delete the selected projects?");
if (answer) {
var listToDelete = new Array();
var arrayCount = 0;
for (i = 0; i < document.projectList.deleteProject.length; i++) {
if (document.projectList.deleteProject[i].checked) {
listToDelete[arrayCount] = document.projectList.deleteProject[i].value;
arrayCount++;
}
}
return listToDelete;
}
}
</script>
If I understand you correctly, you want to know how to push back a collection of IDs to a controller?
In general, this would be done as a FORM and POST the form to the back end. I myself prefer to do this via AJAX but thats just me.
While you can do this using a GET and stuffing all of the IDs in the query string, its dirty!
It would look something like /controller/action?id=7&id=8&id=9
The Model Binder in .NET will convert that in to a List<int> or int[].
I would suggest using ".push" in Javascript to manage you array of IDs. You can also use the ".join" method on your array to create a clean querystring.

Mvccontrib grid export to excel

I'm using mvccontrib grid to show seach result data and export to excel.
I have found this article for exporting data to excel and implemented successful.
In my solution, My gridview have a checkbox column that support user select number of row that they want to export then export to excel.
Please suggest me solutions how to do this. Thanks in advance
I've already solved my problems. I've used a form tag which post to my Export controller.
Inside the form tag I used an hidden field which store my array of ID that I've checked on the grid. Then I called submit the form using javascript to post hidden field string to Export controller. On the controller, I've parsed Id into array then query to get specified my records wanted to export. Below is summary my result.
<%using (Html.BeginForm("Export", "Test", FormMethod.Post, new {id="frmPost" }))
{ %>
<%=Html.Hidden("cmdListID")%>
....
<%} %>
javascript:
$('#cmdExport').click(function () {
var jsonObj = [];
var strData = "";
$('input[name="SelList"]:checked').each(function () {
jsonObj.push({ key: $(this).attr('id') });
});
var postData = { "listID": jsonObj };
if (jsonObj.length > 0) {
strData = JSON.stringify(postData);
$('#cmdListID').val(strData);
}
$('#frmPost').submit();
$('#cmdListID').val('');
});
Export controller: I created a list object(using serialize json) for parsing my expected list object.
Finally, I queried into database again by filtering using those IDs that I got to receive my expected records.
Hope this help.

Resources