return multiple html data in ajax

Question

in my ajax code

.............
........
success: function(datases) 
               {
 $.ajax({

         url:"checkfitment",
         method: 'POST',
        data: {checkfitment:checkfitment, make:selectedmakes},
        success: function(datas) 
    {
 $(".checkfirmentidmsg").html(datas); 
        }
   }); 

 $.ajax({
 url:"showattributespecification",
 method: 'POST',
 data: {checkfitment:checkfitment , make:selectedmakes},
 success: function(datas) 
        {
        $("#specificationsforms").hide();
        $("#showattributespecificationmsg").html(datas); 
             }
});
}

the above two ajax call in main ajax success result,the two ajax pass same data but the result is different.

the functions

public function checkfitment()
{
 $make = $_POST['make'];
$fiter_products= DB::select(...............);
$countfitment = count($fiter_products);
if($countfitment > '0')
        {
?><span class="checkfit"><input type="checkbox" readonly="readonly" checked="checked" name="fitmentchecked" value="1" /> Fits <?php echo $year. ' '.$make.' '.$model;?> <div class="checkfit-oem"><?php echo  '[OEM '.$bolt_pattern.' '.$rim_width.'Jx'.$rim_diameter.']'; ?></div>

         <style> .mfp-container{ display:none;}
                       .checkFitmentsss{ display:none; position:inherit}
                       [type="checkbox"]:not(:checked), [type="checkbox"]:checked {
    position: absolute;
    opacity:unset  !important;;
</style>

            <?php
}
}

anotherfunction

public function showattributespecification()
{
 $make = $_POST['make'];
$fiter_products= DB::select(...............);
$countfitment = count($fiter_products);
if($countfitment > '0')
        {
    echo '<table class="table table-condensed">
                                    <thead>
                                        <tr class="cart_menu">
                                            <td>S.No</td>
                                            <td>Size</td>
                                            <td></td> 
                                            <td>Price</td> 

                                            <td></td> 

                                        </tr>
                                    </thead>';
            $k=1; 
            foreach($fiter_products as $rows)
            {
            ?> 
 <tr class="cart_menu" style="background: aliceblue;">
 <td><?php echo $k; ?></td>
 <td><?php echo $rows->size; ?></td>
  <td><input type="number" name="qty" id="qtys<?php echo $rows->id; ?>" value="4" min="4" /></td>

<td class=""> <?php echo $rows->price; ?> AED</td>
<?php /*?><td>
<div class="stock-btn"><a href="#!"><?php echo $rows->stock_availability; ?></a></div> 
</td><?php */?>
<td>
<?php if($rows->stock_availability=='Available') { ?>
 <div class="stock-btn avilebless" id="avilebleaddtocart<?php echo $rows->id; ?>" style="display:block;"> 
<a href="javascript:void(0)" onclick="addtocarttirebyid<?php echo $rows->id; ?>()" id="<?php echo $rows->id; ?>">Add to Cart</a>
</div>
<?php }
}
}

this time the result is show very slowly and i think its write in a single function and one ajax call,how to write these two function in a single function, how to store these data in a variable?

Can you try using JSON datatype in ajax response with each index storing different HTML data — Ajith
– Ajith, Commented Apr 7, 2020 at 6:15
andrew I have added a sample method, You can folow that method with your live code — Ajith
– Ajith, Commented Apr 7, 2020 at 6:50

Ajith · Accepted Answer · 2020-04-07 06:50:08Z

2

Can you follow the below method from server end and use the following ajax method with datatype json to receive multiple values

$.ajax({        
    url     : "myurl.php",
    method  : 'POST',
    datatype : 'json',
    data    : {
                params1 : value1,
                params2 : value2
              },
    success : function(datas) {

      $("#elem1").html(data.html1); 
      $("#elem2").html(data.html2);

    }
});

myurl.php server side script should be as follows

<?php
    $return = array();
    $html1  = '';
    $html2  = '';

    $html1.='<h2>This is a test element</h2>';
    $html2.='<h2>This is another test element</h2>'

    $return['html1'] = $html1;
    $return['html2'] = $html2;

    echo json_encode($return); exit;

?>

answered Apr 7, 2020 at 6:50

Ajith

2,6784 gold badges21 silver badges43 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

return multiple html data in ajax

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related