Плагин рейтинга jQuery внутри панели обновлений - PullRequest
Новая
       5

Плагин рейтинга jQuery внутри панели обновлений

2 голосов
/ 06 января 2011

Я использую плагин рейтинга jQuery внутри asp: listview с панелью обновления asp :. Ниже приведена функция, которая вызывается по щелчку звезд рейтинга. 

function DisplayRatings() {            
            $('DIV.ratingBar').each(function() {
                var id = $(this).attr('id');
                var count = $(this).attr('rel');
                $('#' + id).raty({
                    showCancel: false,
                    readOnly: false,
                    showHalf: true,
                    start: count,
                    onClick: function(score) {                    
                      // I have to pass the score and ID to server side                    
                    }
                });
            });
        }

Теперь я должен передать «оценку» и «ID» на сторону сервера и вызвать метод, который повторно связывает представление списка и обновляет оценку на экране без обновления экрана. Пожалуйста, предложите, как это сделать (я не могу использовать рейтинг инструментария ajax, так как он не поддерживает половину звездного рейтинга)

Ответы [ 2 ]

3 голосов
/ 06 января 2011

Чтобы передать данные на сервер, просто сохраните их в скрытых полях формы (в панели обновления): 

<asp:HiddenField id="score" runat="server" name="Score" ClientIDMode="Static" />
<asp:HiddenField id="id" runat="server" name="Score" ClientIDMode="Static" />

Если бы у вас было много данных для передачи туда и обратно, возможно, это имело бы смыслпросто использовать одно скрытое поле и использовать сериализацию / десериализацию, чтобы хранить все это там.Затем в вашей функции onClick установите значения этих полей и инициируйте асинхронную обратную передачу: 

$('#score').val(score);
$('#id').val(id);
__doPostBack('UpdatePanelID', '')

Это приведет к асинхронному обновлению вашего UpdatePanel, так же, как если бы связанный элемент управления отправки былщелкнул пользователем.

Обратите внимание, что если сам элемент управления jQuery находится в UpdatePanel, вам придется перенастроить его после асинхронной обратной передачи, поскольку эффект такой же, как если бы страница была перезагружена так далекокак это касается.Однако любой код javascript, который вы могли запустить в $(document).ready() , не будет запускаться после асинхронной обратной передачи, поскольку вся страница фактически не была перезагружена.

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

// Page startup script - this adds a hook after an update panel is refreshed
Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(onRefresh);

function onRefresh(sender, args) {
    // You can try to check which panel was updated
    var panelsUpdated  = args.get_panelsUpdated();
    var panelsCreated = args.get_panelsCreated();
    // but usually it's easier to just track the state of your jquery stuff
    if (my_jquery_thing_is_visible &&
        my_indicator_that_it_has_already_been_configured===false) {
        configureJqueryThing();
    }
}
0 голосов
/ 06 января 2011

Решено с помощью jQuery с AJAX.

aspx

функция SaveRating (id, Score) {
var params = '{linkID: "' + id + '",ratingVal: "'+ score +'"} ';
$ .ajax ({тип: "POST", URL: "page.aspx / UpdateRating", данные: params, contentType: "application / json; charset = utf-8 ", dataType:" json "});}

aspx.cs

[System.Web.Services.WebMethod] public static void UpdateRating (string linkID, int ratingVal) {// код для обновления в db}

...