DropDownList not getting populated

[AshishMember]

Hello,

I have following code in my cshml (Partial view page)

<

scripttype=”text/javascript”>

$(document).ready(

function () {

$(

“#jqxDateTime”).jqxDateTimeInput(

{

width:

‘225px’,

height:

’22px’,

formatString:

‘d’,

theme:

‘classis’

});

var source =

{

datatype:

“json”,

datafields:

[

{ name:

‘ID’ },

{ name:

‘Name’ }

],

id:

‘ID’,

url:

‘Employee/GetRole’,

async:

false

};

var dataAdapter = new $.jqx.dataAdapter(source);

$(

“#jqxDropDownList”).jqxDropDownList(

{

selectedIndex: 0,

source: dataAdapter,

displayMember:

‘Name’,

valueMember:

‘ID’,

width: 200,

height: 25,

theme:

‘classic’

});

$(

“#jqxDropDownList”).bind(‘select’, function (event) {

if (event.args) {

var item = event.args.item;

if (item) {

var valueelement = $(“<div></div>”);

valueelement.html(

“Value: “ + item.value);

var labelelement = $(“<div></div>”);

labelelement.html(

“Label: “ + item.label);

$(

“#selectionlog”).children().remove();

$(

“#selectionlog”).append(labelelement);

$(

“#selectionlog”).append(valueelement);

}

}

});

});

</

script>

View code:

<divclass=”editor-field”>

<divid=’jqxDropDownList’>

</div>

<divstyle=”font-size: 13px; font-family: Verdana;”id=”selectionlog”>

</div>

</div>

and controller

publicJsonResult GetRole()

{

return Json(db.Roles.ToList(), JsonRequestBehavior.AllowGet);

}

 

But my dropdownlist is not getting propulated, its empty.

Could you please check and let me know in case I am missing something?

I am using ASP.NET MVC3 – Razor

Drop down is in my Partial View

 

Regards

Ashish Sapkale

 

[Peter StoevKeymaster]

Hi Ashish,

I suggest you to check whether your server method is called. As you are using ASP .NET MVC, I find setting the contenttype missing in the source object’s initialization, i.e: contenttype: “application/json; charset=utf-8” and type: “POST”.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[AshishMember]

I tried changing method return as
public JsonResult GetRole()
{
return Json(db.Roles.ToList(), “application/json”, Encoding.UTF8, JsonRequestBehavior.AllowGet);
}

Actually,
The action method is not getting called.
The dropdown is part of Partial view.

What could be the issue?

Regards
Ashish

[AshishMember]

Issue solved…

var source =
{
datatype: “json”,
datafields:
[
{ name: ‘ID’ },
{ name: ‘Name’ }
],
id: ‘ID’,
url: ‘../Employee/GetRole’,
async: false
};

Added “../” to url..

But for Grid

method is getting called properly without “../”.

Could you please confirm why is it so?

Regards
Ashish

[Peter StoevKeymaster]

Hi Ashish,

The url param specifies the path to the data source from the current page. If you init a Grid in a different page, the current page will be the Grid’s page and the path could be different.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[AshishMember]

Hi Peter,

Thanks for the information.

One more help…
Could you please suggest me how can we set dropDownLists value on load?

Value will be from Model of MVC.

Regards
Ashish

[Peter StoevKeymaster]

Hi Ashish,

The selectedIndex property specifies the index of the item to be selected.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[AshishMember]

Hi Peter,

OK..

But it is difficult to find index of selected value and then set.

Is there any selected value property?

Any code snippet to set…

Regards
Ashish

[Author]

Posts