0

I have problem with modal's content refreshing.

When modal appears it looks like this My modal.

When I click "Add one more ad" button, I need modal's body to be reloaded. It means that after clicking that button, value is inserted to MySQL database and then one more row in modal should be shown.

This is my modal. Its content is displayed from MySQL database: 

    <div id="myModal" class="modal fade" data-keyboard="false" href="ajax.html" data-toggle="modal" data-target="#myModal" data-remote="false" >
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">Select what you have tagged:</h4>
        <div class="modal-body">
          <div class="row">
            <div class="column1">
              <label class="control-label"></label>
            </div>
            <div class="column1">
              <label class="control-label">Start:</label>
            </div>
            <div class="column1">
              <label class="control-label">Stop:</label>
            </div>
          </div>
          <?php
          $option = array();
          $fetch_option_name = $db->sql_query("SELECT DISTINCT options FROM ads_options");
          while ($row_user = mysql_fetch_assoc($fetch_option_name)) {
            $option[] = $row_user;
          }
          $num = 1;
          foreach($option as $key => $value) {
            foreach($value as $val) {
echo '<div class="row">';
?>
<div class="column">
  <?
  echo '<label class="control-label"> '.$val.' </label>';
  ?>
</div>                  
<div class="column">
  <?
  echo  '<input type="radio" name="radioBtn" value="ad'.$num.'_start">';
  ?>  
</div>
<div class="column">
  <?
  echo  '<input type="radio" name="radioBtn" value="ad'.$num.'_end">';
  ?> 
</div>
<div class="column">
  <?
  echo  '<button type="button" name="resetBtn'.$num.'" class="btn1">reset</button>';
  ?> 
</div>
</div>
<?
++$num;
?>
<?
}
}
?>
</div>
<div class="modal-footer">
 <button type="button" id ="saveBtn" class="btn btn-primary">Save choice</button>
 <button type="button" id = "add_ad" onclick="myFunction();" class="btn btn-primary">Add one more ad</button>
</div>
</div>
</div>
</div>
</div>

This is my javascript and ajax, which refreshing modal's body but it does not take new inserted value from MySQL database (it is testing option and looks like this Reloaded modal:

  $('#add_ad').click(function(){

$.ajax({ url: 'ajax',
 data: {action: 'add_ad'},
 type: 'post',
 success: function() {       

var pf = '<?php $options = array();$fetch_option_name = $db->sql_query("SELECT * FROM ads_options");while ($row_user = mysql_fetch_assoc($fetch_option_name)) {    $options[] = $row_user;} $num = 1; foreach($options as $key => $value) {  foreach($value as $val) {       echo $val; }  }; ?>';    

$("#myModal .modal-body").html(pf); 
$("#myModal").modal('show');    
}

});
  });

So problem is that ajax looks like working but it is not taking inserted new value from database. I need that after clicked button "Add one more ad" new value would be added in database and at the same time after clicked button it would be displayed in modal's body.

Refreshed modal's content is shown only after reloading the page.

TO SUM UP: Is it possible to reload only modal content without reloading whole page?

Mantas Kildišis
  • 1
  • 1
  • 1
    PHP script executes only when page load and it cannot be called by javascript like this after page loaded. – Chaska Feb 26 '20 at 08:09
  • @Chaska but I think it is possible somehow to reload dynamically modal's content after clicking modal's button? – Mantas Kildišis Feb 26 '20 at 08:42
  • @MantasKildišis you need to make a call (to your backend) from javascript to get the new content, then re-populate the DOM. PHP is interperated so adding it to the html will not do anything other that put a string in there. – Pogrindis Feb 26 '20 at 12:41
  • Why do you need second `foreach($value as $val) {` ? `$value` will do the job tough, and is this work ? ` echo` ? should be like this ` –  Feb 26 '20 at 12:52
  • Does this answer your question? [How do I pass variables and data from PHP to JavaScript?](https://stackoverflow.com/questions/23740548/how-do-i-pass-variables-and-data-from-php-to-javascript) – Tschallacka Feb 26 '20 at 14:31

0 Answers0