How do I populate content in gridview using ajax call or javascript [Resolved]

Posted by Self-Innovator under jQuery on 4/14/2016 | Points: 10 | Views : 383 | Status : [Member] | Replies : 1
Hi All,

I am new to MVC i have to bind gridview with some report content individually on dropdown selected index change event.

The below code is my dropdown


<div class="form-group col-md-4">
@Html.DropDownList("bindReports", new List<SelectListItem>()
{
new SelectListItem() { Text= "Consolidated Purchases", Value = "cr" },
new SelectListItem() { Text= "Programs", Value = "gi" },
new SelectListItem() { Text= "Logistics", Value = "lg" },
new SelectListItem() { Text= "General Information", Value = "pr" }
}, "Select Report")
</div>


If i select Logistics an appropriate sp i need to call with ReportId as Parameter and bind gridview with logistics report details.. Kindly suggest with some answers

I have tried in this approach..

document.ready(function()
{
$('#bindReports').bind('change', function (e) {
getReportDetails('', '');
});
}

function getReportDetails() {
$.ajax({
url: urlPath,
success: function (result) {

},
error: function (xhr, status, error) {
showAlert("Error...!", error);
}
});
}


Join Hands Change lives
Thanks & Regards
Straight Edge Society



Responses

Posted by: Rajnilari2015 on: 4/14/2016 [Member] [Microsoft_MVP] [MVP] Platinum | Points: 50

Up
0
Down

Resolved
Just providing an example

In the editor template provide an empty dropdown:

<%= Html.DropDownListFor(
x => x.PropertyToHoldSelectedValue,
Enumerable.Empty<SelectListItem>(),
"-- Loading Values --",
new { id = "Test" })
%>

Then setup a controller action that will return the values:

public class TestController: Controller
{
public ActionResult Index()
{
return Json(new[] {
new { Id = 1, Value = "value 1" },
new { Id = 2, Value = "value 2" },
new { Id = 3, Value = "value 3" },
}, JsonRequestBehavior.AllowGet);
}
}

And then populate the values using AJAX:

$(function() {
$.getJSON('/test/index', function(result) {
var ddl = $('#test');
ddl.empty();
$(result).each(function() {
$(document.createElement('option'))
.attr('value', this.Id)
.text(this.Value)
.appendTo(ddl);
});
});
});


--
Thanks & Regards,
RNA Team

Self-Innovator, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response