I have a @Html.DropDownList which calls a jquery function. But it failed to call the function. I have tried-
$(document).ready(function () {
$('.test').change(function () {
alert("1");
});
});
@Html.DropDownList("PropertyContent", ViewBag.PropertyList as List<SelectListItem>, new { @class="test"})
and
function test() {
alert("1");
}
@Html.DropDownList("PropertyContent", ViewBag.PropertyList as List<SelectListItem>, new { onchange="test();"})
@Scripts.Render("~/bundles/jqueryval") is also included in the view
Whats wrong here?
I have a @Html.DropDownList which calls a jquery function. But it failed to call the function. I have tried-
$(document).ready(function () {
$('.test').change(function () {
alert("1");
});
});
@Html.DropDownList("PropertyContent", ViewBag.PropertyList as List<SelectListItem>, new { @class="test"})
and
function test() {
alert("1");
}
@Html.DropDownList("PropertyContent", ViewBag.PropertyList as List<SelectListItem>, new { onchange="test();"})
@Scripts.Render("~/bundles/jqueryval") is also included in the view
Whats wrong here?
Share Improve this question edited May 15, 2013 at 9:43 Sandy asked May 15, 2013 at 9:34 SandySandy 2,4497 gold badges35 silver badges63 bronze badges 5-
What's the error? Do you see any error in console? Are you include
jQuery
in your page? – user1823761 Commented May 15, 2013 at 9:35 -
Also you must write
$('.test')
instead of$('test')
. Because you want to access elements withtest
class. – user1823761 Commented May 15, 2013 at 9:37 - @Mojtaba- I have updated my question. Actually I tried with $('.test'). I am not getting any error. Its not invoking the function! – Sandy Commented May 15, 2013 at 9:41
- Confirm that jQuery actually shows up in view source - if you have a folder physically named the same as your bundle path, bundling won't work. – ScottE Commented May 15, 2013 at 11:17
- Please read about jQuery selectors – Umar Farooq Khawaja Commented May 15, 2013 at 11:46
6 Answers
Reset to default 4Your jQuery selector is wrong, use the id-selector instead:
$(document).ready(function () {
$('#PropertyContent').change(function () {
alert("1");
});
});
A few more possible errors:
- jQuery is not referenced in the page. To check this, open firebug, chrome dev tools or IE dev tools and check whether you have any errors
- A mon error is to include the $(document).ready inside the view, and only reference jQuery at the bottom. This will generate an error because at that point
$
is not known. Possible solutions:- Move the code to an external file and reference that file after the jQuery inclusion
- Move your jQuery declaration to the head-section (not remended as it will slow down the page load)
$(document).ready(function () {
$('.test').change(function () {
alert("1");
});
});
$('.test').change(function () {
// on this part u need to add '.'
in test
u forgot that it is a class.
You can also use following code.
$(document).ready(function () {
$(".test").live("change",function () {
alert("1");
});
});
Working FIDDLE Demo
$(function () {
$('#PropertyContent').change(function () {
alert("1");
});
});
Add the following line somewhere in the view or the layout:
@Scripts.Render("~/bundles/jquery")
Also your selector is not correct. You have no HTML element with class="test"
.
Try $('#PropertyContent')
instead.
Please try to get the dropDownList by its Id like the code below. I got a working example for you: http://jsfiddle/pzzQu/
$(document).ready(function () {
$('#PropertyContent').change(function(){
alert('1');
});
});