Автозаполнение JQuery в ASP.NET MVC view - PullRequest
Новая
       31

Автозаполнение JQuery в ASP.NET MVC view

0 голосов
/ 09 января 2010

У меня есть работающее автозаполнение jQuery (по bassistance ) на мой взгляд. Проблема в том, что я просто не понимаю этого. Действие MVC возвращает данные в формате JSON, а плагин прекрасно их считывает, а фильтр отлично работает - в нем перечислены результаты, и я могу выбрать из выпадающего списка. Но затем, когда я выбираю это, ничего не происходит - я выбираю элемент либо нажатием Enter, либо щелкая по нему. Я думаю, что я должен как-то подключить функцию result () - я пытался с опцией onItemSelect, но она не работает, ничего не происходит, result () не срабатывает.

В конце концов, все, что мне нужно, - это возможность постоянно добавлять элемент, который пользователь выбирает, в список или в список.

Я думаю, что большинство моих проблем связано с отсутствием знания jQuery или JavaScript в целом, которое, как я признаю, мне никогда не нравилось, но теперь с ASP.NET MVC я вынужден его изучить, на самом деле я нахожу это очень полезным возможность обойти постбэки ..

Это мой код: 

<script type="text/javascript">

$(document).ready(function() {
    $("#Products").focus().autocomplete('<%=Url.Action("GetProducts", "Product") %>', {
        dataType: 'json',
        parse: function(data) {
            var rows = new Array();
            for(var i=0; i<data.length; i++) {
                rows[i] = { data:data[i], value:data[i].product_id, result:data[i].product_name1};
            }
            return rows;
        },

        formatItem: function(row, i, n) {
            return row.product_PrettyId + ' - ' + row.product_name1 + ' (' + row.product_price + ' €) ';
        },      
        width: 900,
        minChars: 0,
        max: 0,
        mustMatch: true,
        onItemSelect: result,
    });
});

function result(extra) {
    $("#result").val(extra);
}   

</script>

Вид: 

<div>
    <%=Html.TextBox("Products", null, new { style = "font-size: 20px; width: 900px"}) %>
</div>
<div id="result"></div>

Также обратите внимание, что мое решение должно работать с включенным и отключенным JavaScript, поэтому в моем окончательном решении я также хотел бы предоставить элемент управления кнопки, который бы выполнял обратную передачу и классическую публикацию в действие моего контроллера для добавления элемента в список. .

Ответы [ 2 ]

1 голос
/ 04 августа 2010

Маре, смотри здесь: http://groups.google.com/group/jquery-en/browse_thread/thread/822a07c9d7d49d35

Проблема в автозаполнении, предполагающая, что ваши данные всегда являются строкой, но в вашем случае это не так - вы используете json.

Используйте неупакованный autocomplete.js и добавьте "s = s.toString ();" как раз перед строкой, где ваш скрипт завершается неудачей.

0 голосов
/ 09 января 2010

Я считаю, что единственное, что вам нужно изменить, - это ваш метод результата. 

function result(extra) {
    $("#result").append(extra.selectValue);
}

Выбранный вами (дополнительный) элемент хранится внутри как <li>. Из-за этого вам нужно получить selectValue, а не val (). Последние шесть месяцев я боролся с JavaScript, JQuery и MVC, поэтому чувствую вашу боль.

...