Retrieving data without refreshing the page with ajax in django-CodePudding

I can post with ajax, but when I want to pull data without refreshing the page, I can only do it 2 times, then the button loses its function.

 <div>
                          <input type="hidden" name="producecode"  value="{{per.produceCode}}" />
                          <input type="hidden" name="useremail"  value="{{user.username}}" />
                          <button ><i ></i></button></div>

and jquery

 $.ajax({
    type: "POST",
    url: "/uponequantity/",
    headers: { "X-CSRFToken": '{{csrf_token}}' },
    data: {
    "producecode":$(this).parent().find(".pcode").val(),
    "useremail":$(".uponequantity").val(),
  },
    success: function() {
      window.location.assign('/basket/' "?b=" $(".uponequantity").val());
    }

    
});
/*$.ajax({
              url:'/baskett/' "?b=" $(".uponequantity").val(),
              headers: { "X-CSRFToken": '{{csrf_token}}' },
              type:'POST',
              success:function(result){
                  $('.basket').html(result);
      }
      });

*/

})

CodePudding user response：

Just add another line to reference your second input same as the first.

$(".up").click(function(){
  $(".prdtd").find("input:first-  child").attr("value"); 
  $(".pcode").val()
  $(".uponequantity").val()//<-- new line for the second hidden value
}

-----------------------------------------
Update:
-----------------------------------------

OP has multiple buttons with the same class each in it's own div and wants to access the values within each div.

So, first off you need to change "pcode" from an id to class in order to get all instances. (id is for unique instances)

After that you need to be able to get the "pcode" & "uponequantity" that are associated with that button and one way of doing that is:

$(".up").click(function(){
  $(this).parent().find(".pcode").val()
  $(this).parent().find(".uponequantity").val()
}

Simply put, the this keyword references the clicked button.
You then get the direct parent element which would have the button and the hidden values as children.
Finally you get each specific child through the find command and do whatever you want with them.

CodePudding user response：

If I understand your question correctly, you would like to get the value of both inputs in your callback.

It seems like you misspelt pdcode in your JavaScript.

Does the below code snippet help?

$(".up").click(function() {
  const value1 = $(".pdcode").val();
  const value2 = $(".uponequantity").val();
}