Как создать пост-голосование в stackoverflow как функция jquery / ajax? - PullRequest
Новая
       14

Как создать пост-голосование в stackoverflow как функция jquery / ajax?

3 голосов
/ 18 апреля 2010

Могу ли я использовать Jquery для вызова действия, а затем изменить изображение в случае успеха, как функция пост-голосования stackoverflow?

На мой взгляд, я использую следующий код, но не хочу обновлять браузер. Может ли кто-нибудь предоставить мне код об этом?

Большое спасибо. 

<%if (!item.IsPrinted)
{ %>
     <%=Html.ImageLink("~/Content/images/web/delete.png", "printed", "MarkAsPrinted", "Order", item.TaskID, null, null)%>
 <%}
 else
  {%>
       <img src="~/Content/images/web/star.png" alt="printed" />                    
  <% }  %>

Ответы [ 5 ]

4 голосов
/ 18 апреля 2010

Как правило, для этого вы должны вызывать вспомогательные методы через вызов ajax, а не вызывать ваши действия через ajax. Затем в вспомогательном методе обновите значение оценки (например, сохраните последнее значение в базе данных и т. Д.) И в методе успеха ajax отобразите соответствующее изображение

Edit: 

public string UpdateVoteScore(int postId, int value) {
     // store value to database

     return "success";
}

В JavaScript: 

var UpdateScore = function(postId, newValue) {
   $.ajax({
           type: "POST",
           url: /YourController/UpdateVoteScore,
           data: { postId: postId, value: newValue },
           success: function(result) {
              // replace your image
              $("#MyImage" + postId).attr("src", "some new image path here");
           },
           error: function(req, status, error) {
           }
    });
}

В представлении: 

<img id='<%= "MyImage" + post.Id %>' 
     src="some image path"
     onclick="UpdateScore(scoreValueHere);"></img>

Примечание: post будет меняться, когда вы будете делать это в цикле, поэтому post.Id будет уникальным и, следовательно, сделает идентификатор изображения уникальным

2 голосов
/ 18 апреля 2010

Да, вы можете использовать JQuery для этого. Например, позволяя JQuery заменить часть вашего HTML-кода в зависимости от того, что он получает от серверного скрипта.

Пример: 

<html>
  <head>
    <script type="text/javascript" src="jquery-1.3.1.js"></script>
    <script type="text/javascript" src="jquery.form.js"></script>
    <script>
      $(document).ready(function(){
        $('#response a').bind('click',function(event){
          event.preventDefault();
          $.get(this.href,{},function(response){
          if (response.indexOf("OK") >= 0) {
            $('#response').html("<img src="~/Content/images/web/star.png" alt="printed" /> ");
          }
          })    
        })
      });
    </script>
  </head>
  <body>
    ... the other things on you're page
    <div id="response">
      <%=Html.ImageLink("~/Content/images/web/delete.png", "printed", "MarkAsPrinted", "Order", item.TaskID, null, null)%>
    </div>
    ... more things on you're page...
  </body>
</html>

Убедитесь, что серверный скрипт возвращает «ОК», когда ему нужно заменить то, что находится в div «respone».

0 голосов
/ 02 апреля 2014

Я создал простое приложение для голосования , похожее на stackoverflow.com, используя angularjs, php и mysql с кодом для загрузки. Вам просто нужно изменить файлы 2 php в файлы ASP.NET. Все остальное будет целым. Создание приложения для голосования с использованием AngularJS намного проще и гибче.

0 голосов
/ 18 апреля 2010

Возможно, вы могли бы сделать что-то вроде: 

$('#vote_button').click(function() {
   $.ajax({
      type: "GET",
      url: "script_name.asp", //your script that talks to the database
      data: "id=" + some_var, //get arguments
      success: $("#image_to_be_changed").attr("src", "some new image path here");
});
0 голосов
/ 18 апреля 2010

Я не уверен, что вы полностью понимаете, что такое ajax или делает.

Способ, которым запросы обычно выполняются без ajax, по сути таков: 

[browser request]->[server handles request]->[new page sent to browser]

Разница с ajax в том, что запрос отправляется на сервер, а ответ принимается javascript, без перезагрузки страницы или чего-либо еще. Затем сценарий javascript решает, что делать после получения запроса.

Что бы вы сделали для этого, отправьте запрос на «voice.asp» или что-то еще, а затем используйте javascript для изменения изображения , как только вы получите ответ от сервера .

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...