JQuery - каков наилучший способ запустить действие контроллера MVC через JQuery?

Question

По сути, у меня есть несколько радиокнопок в столбце фильтрации. Например, если я нахожусь в разделе \ Catalogue \ Flooring \ Harwood, у меня есть радио-кнопки для [Коврики], [Carpet] & [Stone & Tile]. Итак, что я хочу сделать, вместо того, чтобы вставлять тег под Radio Button, я бы хотел запустить событие JQuery и сделать обычную запись обратно на сервер. Я думаю, что $ .post () должен это делать, но у меня это не работает правильно.

PS: В любом случае, чтобы встроить / включить файл jquery-1.3.2-vsdoc.js в мой файл JS, чтобы я получил полный смысл?

Answer 1

Это ajax-вызов для перемещения элемента вверх и вниз с помощью действия контроллера MVC:

    [ActionName("item-reorder")]
    [AcceptVerbs(HttpVerbs.Post)]
    public string ItemReorder(Guid id, string direction)
    {
        ReorderDirection dir = (ReorderDirection)Enum.Parse(typeof(ReorderDirection), direction, true);
        int newSequence = this.WebServiceProxy.MoveItem(id, dir);
        if (newSequence >= 0)
            return ConfigurationManager.AppSettings["Ajax:Success"];
        else
            return ConfigurationManager.AppSettings["Ajax:Fail"];
    }

и JavaScript:

AjaxMoveItem: function(row, direction) {
    //get the id from the attribute
    var itemId = row.attr('itemId');
    //update server
    $.ajax({
        type: 'POST',
        url: '/item-reorder',
        //data: ({ id: itemId, direction: direction }), //didn't work .. vars passed as null
        data: ({ id: itemId, direction: direction }),
        success: function(responseText) {
            if (responseText == 'success') {

                alert('moved');
            } else {
                alert('error: ' + responseText);
            }
        },
        error: function() {
            alert('unknown error');
        }
    });
},

Answer 2

Инициализировать:

$(document).ready(function() {
    // Bind actions...
    $("#Navigation li[title]").live("click", function(e) { e.preventDefault; this.blur(); return updateNavigation($(this).attr('title')); });
    $("#ItemsPerPage").change(function(e) { return updatePaging(); });

    $('input[name=ProductType]').click(function() { return updateRadio(); });  //{ $('form#typeForm').submit(); });
    $(":checkbox").change(function(e) { return updateCheck(); });
});

Ответ на событие переключателя ProductType:

function updateRadio() {
    var productGroup = $("#valProductGroup").attr('title');
    var productType = $("input:radio[checked]").val();
    var url = "/Catalog/" + productGroup + "/" + productType;

    window.location = url;
    return false;
}

Спасибо всем.

Answer 3

Вы можете использовать GET - для этого нужно получить / Каталог / Напольные покрытия / Харвуд /

$(function() {
   $('input[type=radio]').click( function() {
       location.href = '<%= Url.Action( "Harwood", "Catalog/Flooring" ) %>' + '/' + $(this).val();
   });
});

<input type='radio' id='rugsRadio' name='typeRadio' value='AreaRugs' />
<input type='radio' id='carpetRadio' name='typeRadio' value='Carpet' />
...

Или вы можете использовать POST - это будет сообщение / Catalog / Flooring / Harwood с выбранным typeRadio в качестве параметра формы:

$(function() {
    $('input[name=typeRadio]').click( function() {
        $('form#typeForm').submit();
    });
});

<% using (Html.BeginForm("Flooring","Catalog", new { id = "Harwood" })) { %>
    <input type='radio' id='rugsRadio' name='typeRadio' value='AreaRugs' />
    <input type='radio' id='carpetRadio' name='typeRadio' value='Carpet' />
    ...
<% } %>