AJAX JQuery不更新跨文本

时间:2022-02-08 08:13:24

I am using a star rating script here, the script updates my database correctly but the returned text in my spans (avgrat and totalrat) are not updated. The variables in between both span tags should be updated with the returned values.

我在这里使用星级评分脚本,脚本正确更新我的数据库,但我的跨度(avgrat和totalrat)中的返回文本未更新。应使用返回的值更新两个span标记之间的变量。

Returned value:

退货价值:

echo json_encode($ratingRow);

HTML

HTML

<div class="col-sm-3">
  <?php echo form_open('http://localhost/mysite/rating/rate'); ?>
  <input name="rating" value="<?php echo $ratingRow['stars']; ?>" id="rating_star" type="hidden" postID="<?php echo $nsid; ?>" />
  <div class="overall-rating">
    Overall Rating of <span id="avgrat"><?php echo $ratingRow['average_rating']; ?></span> Based on <span id="totalrat"><?php  echo $ratingRow['rating_number'] ?></span> votes.
  </div>
  <?php echo form_close(); ?>
</div>

Script

脚本

<script type="text/javascript">
  $(function() {
    $("#rating_star").codexworld_rating_widget({
      starLength: '5',
      initialValue: $('#rating_star').val(),
      callbackFunctionName: 'processRating',
      imageDirectory: '<?php echo base_url(); ?>i/icon',
      inputAttr: 'postID'
    }); 
  });

  function processRating(val, attrVal){
    $.ajax({
      type: 'POST',
      url: '<?php echo base_url(); ?>rating/rate',
      data: {'<?php echo $this->security->get_csrf_token_name(); ?>' : '<?php echo $this->security->get_csrf_hash(); ?>', "postID":attrVal, "ratingPoints":val},
      dataType: 'json',
      success : function(data) {
        if (data.status == 'ok') {
          $("span#avgrat").text($(this).data("average_rating"));
          $("span#totalrat").text($(this).data("rating_number"));
        }else{
          alert('Some problem occured, please try again.');
        }
      }
    });
  }
</script>

1 个解决方案

#1


1  

Change these:

改变这些:

$("span#avgrat").text($(this).data("average_rating"));
$("span#totalrat").text($(this).data("rating_number"));

To these:

对于这些:

data = JSON.parse(data);
$("span#avgrat").text(data[0]["average_rating"]);
$("span#totalrat").text(data[0]["rating_number"]);

You cannot use this there. The this there refers to the success function. You have to first parse the data using JSON.parse(data). So it becomes a JavaScript Object from a string. This is optional, as you have already used dataType: "json". Now it should work for you as expected.

你不能在那里使用它。这就是指成功的功能。您必须首先使用JSON.parse(data)解析数据。所以它成为一个字符串的JavaScript对象。这是可选的,因为您已经使用了dataType:“json”。现在它应该按预期工作。

The data is an object and not a function. You have used data("rating_number"), which should be data[0]["rating_number"] and so on. Kindly check the updated answer.

数据是一个对象而不是一个函数。您使用了数据(“rating_number”),它应该是data [0] [“rating_number”]等等。请检查更新的答案。

#1


1  

Change these:

改变这些:

$("span#avgrat").text($(this).data("average_rating"));
$("span#totalrat").text($(this).data("rating_number"));

To these:

对于这些:

data = JSON.parse(data);
$("span#avgrat").text(data[0]["average_rating"]);
$("span#totalrat").text(data[0]["rating_number"]);

You cannot use this there. The this there refers to the success function. You have to first parse the data using JSON.parse(data). So it becomes a JavaScript Object from a string. This is optional, as you have already used dataType: "json". Now it should work for you as expected.

你不能在那里使用它。这就是指成功的功能。您必须首先使用JSON.parse(data)解析数据。所以它成为一个字符串的JavaScript对象。这是可选的,因为您已经使用了dataType:“json”。现在它应该按预期工作。

The data is an object and not a function. You have used data("rating_number"), which should be data[0]["rating_number"] and so on. Kindly check the updated answer.

数据是一个对象而不是一个函数。您使用了数据(“rating_number”),它应该是data [0] [“rating_number”]等等。请检查更新的答案。