jQuery UI的滑块显示错误

Question

你好的人时遇到的MVC3一个问题，我的jQuery的滑块显示以下错误的地方，我需要滑块：

[object Object] 

滑块不visable jquery的剧本我已经加入如下：

<script type="text/javascript"> 

    $(function() { 
     $("#slider-range-max").slider({ 
      range: "max", 
      min: 1, 
      max: 10, 
      value: 2, 
      slide: function (event, ui) { 
       $("#Score").val(ui.value); 
      } 
     }); 
     $("#Score").val($("#slider-range-max").slider("value")); 
    }); 
    </script> 

其指的这个领域在我看来：

<div class="editor-label"> 
     @Html.LabelFor(model => model.Score) 
    </div> 
    <div class="editor-field"> 
     @Html.EditorFor(model => model.Score) 
     @Html.ValidationMessageFor(model => model.Score) 
    </div> 

我已经添加了以下的jQuery脚本到我的观点：

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"</script> 
<link href="../../Content/themes/base/jquery.ui.all.css" rel="stylesheet" type="text/css"/> 
<script src="../../Scripts/jquery-ui-1.8.11.min.js" type="text/javascript"></script> 
<script src="../../Scripts/jquery.ui.core.js" type="text/javascript"></script> 
<script src="../../Scripts/jquery.ui.widget.js" type="text/javascript"></script> 
<script src="../../Scripts/jquery.ui.slider.js" type="text/javascript"></script> 
<script src="../../Scripts/jquery.ui.mouse.js" type="text/javascript"></script> 
<script src="../../Scripts/modernizr-1.7.js" type="text/javascript"></script> 

如果您需要addtional信息请咨询我谢谢

Answer 1

首先，你需要添加下面的jQuery脚本：

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" type="text/css" media="all" /> 
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" /> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" type="text/javascript"></script> 
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/external/jquery.bgiframe-2.1.2.js" type="text/javascript"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/i18n/jquery-ui-i18n.min.js" type="text/javascript"></script> 

第二加你的看法：

<script type="text/javascript"> 
    $(function() { 
     $("#slider-range-max").slider({ 
      range: "max", 
      min: 1, 
      max: 10, 
      value: 2, 
      slide: function(event, ui) { 
       $("#PutYourValueHere").val(ui.value); 
      } 
     }); 
$("#PutYourValueHere").val($("#slider-range-max").slider("value")); 
    }); 
    </script> 

它说PutYourValueHere sh自己以上 - 与model.PutValueHere一致。

@Html.EditorFor(model => model.PutYourValueHere) 

按照这些步骤应该工作。