Bootstrap modal with checkbox to not show in future

Question

I am trying to show a bootstrap modal on body load based on value from mysql database. I have included bootstrap modal in body and showing it successfully according to database value with:

    $resultsPop = mysql_query("select popup from members where mid=" . $mid);
    $pop = mysql_result($resultsPop, 0, "popup");
    if($pop == 0) {
            $popupval = "<script type='text/javascript'>$(window).load(function(){ $('#MyPopUp').modal('show'); });</script>";
    } else {
            $popupval = "";
    }
echo $popupval;

And my modal code is:

  <div class="modal fade" id="MyPopUp" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="">
    <div class="modal-dialog modal-lg">
        <div class="modal-content" style="">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                        <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">Welcome</h4>
            </div>

                <div class="modal-body" style="text-align: center;">
                   <span>
                        Welcome Popup
                  </span>
                </div>
        </div>
    </div>
</div>

Now, I want to have a checkbox in the modal which on checked can silently pass value 1 and logged in member variable $mid value to a php page after user clicks on modal close button. So, popup value in members table is updated with 1 for that logged in member who do not want popup to be see again.

I have searched for such thing but couldn't successful and I am getting no idea on it.

preliminary reading: http://stackoverflow.com/questions/8363802/bind-a-function-to-twitter-bootstrap-modal-close — mickmackusa, Feb 22 '17 at 01:02
So you mean that I put checkbox id and member variable id in bootstrap modal and send values through ids with ajax in that bootstrap close modal javascript? — Hashmi, Feb 22 '17 at 01:06
If $mid is not held in a SESSION variable, yes, put those values into the modal. On modal close, feed those values into the ajax function. You'll need to update the question to get further specific feedback. — mickmackusa, Feb 22 '17 at 01:09
Thank you so much for the idea. I think this will be enough for me because I can test successfully an alert on close as per your mentioned link. You can answer the idea and I will accept it because I was only looking to have an idea. :) Thanks again — Hashmi, Feb 22 '17 at 01:13
Nah, it is a duplicate. You can remove this question. Too many duplicates for moderators to manage on SO. Thank you for the offer, but I'm just happy to help. All the best. — mickmackusa, Feb 22 '17 at 01:14
I can delete but since its a unique question by subject, so I can answer my own question after successful so it is a help for any one else. Who knows there's some one as poor as me in coding. ;) — Hashmi, Feb 22 '17 at 01:16
The core of the question is a duplicate. Your grander question may or may be unique. The question's title is not very helpful from a "search" point of view. The first part of your question is answered already in the link. If you have future questions, ask a new question that is simple and direct and maybe it will be unique. — mickmackusa, Feb 22 '17 at 01:19
Learning how to succinctly ask and title questions on SO comes with experience. I'm not a heavy weight at just 700rep points, but I have learned a lot simply by using SO. Knowing what keywords to search for on SO and google comes with experience too. We all get better with practice. — mickmackusa, Feb 22 '17 at 01:25
Got you ... so to just have an idea ... what do you think this question's subject should? — Hashmi, Feb 22 '17 at 01:27
`Bind a function to Twitter Bootstrap Modal Close` as the duplicate post uses. :) That's how I was able to search for it so easily. Very clear and brief, loaded with vital keywords. — mickmackusa, Feb 22 '17 at 01:30
Before asking a question, try to find the root problem then search like made on SO or google. By doing this, you will naturally discover the necessary keywords and probably find the answer. If you don't find the answer, you've got a unique question to ask. (there aren't many unique questions per day) — mickmackusa, Feb 22 '17 at 01:32
That's awesome help really. but i actually searched for what i wanted to do because I had no idea how it would be done. If I had, I would certainly use something like you suggested. — Hashmi, Feb 22 '17 at 01:37
In three year on SO, I've only managed to ask 3 unique questions. Look at the way I have titled them: http://stackoverflow.com/users/2943403/mickmackusa?tab=questions — mickmackusa, Feb 22 '17 at 01:37
don't get me wrong, I'm not calling you a bad person here. I am happy to direct you to an existing question/answer. I am still learning how to best use SO myself. — mickmackusa, Feb 22 '17 at 01:40
Please delete this question as people will be wasting support time creating answers for it. (looking to scoop some easy points). — mickmackusa, Feb 22 '17 at 01:42
Thanks for your help, but I can not waste effort of a person who helped me going to level zero. :) — Hashmi, Feb 22 '17 at 01:43

score 1 · Accepted Answer · answered Feb 22 '17 at 01:37

Try this.

yourphpfile.php

<?php

$resultsPop = mysql_query("select popup from members where mid=" . $mid);
    $pop = mysql_result($resultsPop, 0, "popup");
    if($pop == 0) {
            $popupval = "<script type='text/javascript'>$(window).load(function(){ $('#MyPopUp').modal('show'); });</script>";
    } else {
            $popupval = "";
    }
echo $popupval;

$ppop = $_POST['pops'];
$username = $_POST['mids'];

//Here you can update your database with 1 where username is mids.

//On success 
$output = json_encode(array('type' => 'pop'));
die($output);

//Else

$output = json_encode(array('type' => 'error'));
die($output);

?>

<script>

$(document).ready(function(){

$("#closemodal").click(function(event){
    event.preventDefault();
    var popups            = $('#popups').val(); 
    var user_id           = $('#mids').val();
 
        $.ajax({
            type: 'post',
            url: yourphpfile.php,
            dataType: 'json',
            data: $('#yourform').serialize(),             
            success: function(data)
            {
                if(data.type == 'pop')
                {
                 $('#MyPopUp').modal('hide');                  
                  
                }
            }
        });

});

});

</script>

<div class="modal fade" id="MyPopUp" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="">
    <div class="modal-dialog modal-lg">
        <div class="modal-content" style="">
            <div class="modal-header">
                <button type="button" class="close" id="closemodal" aria-label="Close">
                                        <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">Welcome</h4>
            </div>

                <div class="modal-body" style="text-align: center;">
                   <span>
                        Welcome Popup
                  </span>
                  <form action="" id="yourform" method="POST" role="form">                   
                  
                   <div class="checkbox">
       <label><input type="checkbox" name="pops" id="popups" value="1">Pops</label>
     </div>
     <input type="hidden" id="mids" name="mids" value="<?php echo $_SESSION['mids']; ?>">                  
                  </form>
                </div>
        </div>
    </div>
</div>

Bootstrap modal with checkbox to not show in future

1 Answers1