在MVC3中填充Jquery Combobox

时间:2012-12-15 12:26:59

标签: jquery asp.net-mvc-3 combobox

我是Jquery和MVC 3的新手。

我正在尝试创建一个非常简单的示例。

我有一个jquery组合框,在页面加载期间我想用一些数据填充它。

所以这是代码:

客户

$(function () {
       $("#combobox").combobox({
        //    initialValues: ['array', 'of', 'values'],
           source: function (request, response) {
               if (!request.term.length) {
                   response(_self.options.initialValues);
               } else {
                   if (typeof _self.options.source === "function") {
                       _self.options.source(request, response);
                   } else if (typeof _self.options.source === "string") {

                       $.ajax({
                           url: "/dropdown/GetList",
                           //data: request,
                           dataType: "json"
                           //success: function (data, status) {
                             //  response(data);
                           //},
                           //error: function () {
                            //   response([]);
                          // }
                       });



                   }
               }
           }

        });
        $("#toggle").click(function () {
          //  $("#combobox").toggle();
        });
    });


**Function in Controller**
[HttpGet]
        public JsonResult GetList()
        {
            try
            {
                Employee objName = new Employee();
                objName.Name = "Test";
                List<Employee> objectList = new List<Employee>();
                objectList.Add(objName);
                return Json(new { Records = objectList, TotalRecordCount = 1 });
            }
            catch (Exception ex)
            {
                return Json(new { Result = "ERROR", Message = ex.Message });
            }
        }

我在服务器端功能中设置了断点,但它从未到达那里。   我将非常感谢你的帮助!

先谢谢了, V

2 个答案:

答案 0 :(得分:0)

关于你的网址。试试dropdown/GetList这应该有效。

同时给this article读一读。

这是我能提出的一个简单例子,

控制器代码

public ActionResult Test()
{
    string test = "Hello World";
    return Json(test, JsonRequestBehavior.AllowGet);
}

网络Api代码

public string Test()
{
    string test = "Hello World";
    return test;
}

Jquery代码

<script type="text/javascript" src="../../Scripts/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $.ajax({
            url: "Home/Test",
            dataType: "json",
            success: function (result) {
                console.log(result);
            }
        });
    });
</script>

答案 1 :(得分:0)

我曾经通过以下方法在dropdown / combobox中加载数据。请确保指定的URL正确无误。它将调用您在“Controller”的URL中指定的ActionResult,并在ActionResult中返回Json以加载数据。

<强>脚本

  <script type="text/javascript">
    var dropDownOptions = null;
    function GetdropDownData(sender, args) {
        $.ajax({
            type: "POST",
            url: "Home/GetCountries",
            dataType: "json",
            success: function (data) {
                dropDownOptions = data;

            }
        });
    }

  </script>

控制器

 public ActionResult GetCountries()
    {
        return Json(CountryList, JsonRequestBehavior.AllowGet);

    }


public IEnumerable<SelectListItem> CountryList
    {
        get
        {
            // load data here
            return type;
        }
    }