Tuesday, 26 January 2016

How to implement dropdown by json in Jquery?

<select name="ddlCategoryHeader" class="ch_select " id="ddlCategoryHeader"> </select>


<script type="text/javascript">
    $(document).ready(function () {
        loadCategory();
    });

    function loadCategory() {
        debugger;
        $("#ddlCategoryHeader").html('');
        $("#ddlCategoryHeader").append($('<option></option>').val(0).html('--Select Category--'));

        $.ajax({
            url: "@Url.Action("GetAllSortedCategory", "Common")",
            dataType: "json",
            type: "GET",
            success: function (data) {
                debugger;
                $.each(data, function (i, option) {
                    if (option.ParentID == 0)
                        $("#ddlCategoryHeader").append($('<option></option>').val(option.ID).html(option.Name));
                    else
                        $("#ddlCategoryHeader").append($('<option></option>').val(option.ID).html("--" + option.Name));
                });
            },
            error: function () {
                //alert(" Failed to load category.");
            }
        });
    }
</script>

public ActionResult GetAllSortedCategory()
        {
            var cat = _apiCategory.GetAllSortedCategory();

            return Json(cat, JsonRequestBehavior.AllowGet);
        }

No comments:

Post a Comment