简体   繁体   中英

Submitting a php pop-up form with javascript

I have a pop up form in php that is opened by javascript. I want this to be sent to my database when I click on submit. The php form works fine without the javascript, but when added it doesn t work. Would you have any idea how to solve this.

 </style>
 <script type='text/javascript'>
 $(document).ready(function() {
  $('#box_form').dialog({
    autoOpen: false,
    height: 375,
    width: 350,
    modal: true,
    buttons: [
        {
        text: "Cancel",
        click: function() {
            $(this).dialog("close");
        }},
    {
        text: "Submit",
        click: function() {
            $('#former').submit();
        }}
    ]
});
$('#clicky').button().click(function(e){
    $('#box_form').dialog('open');
});
  });
    </script>
    </head>
   <body>
   <form id="former" method="post" action="film_post.php" name="former">
  <div id="box_form">
   <select id="option" name="option">
                    <option value="film">film</option>
                    <option value="livre">livre</option>
                    <option value="musique">musique</option>            
            </select></p>
    <p>
    <select id="star" name="star">
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option> 

            </select></p>
    <label for="nom">nom</label> :  <input type="text" name="nom" id="nom" /><br />

 </div>
 </form>
 <input type="button" id="clicky" value="Show Form">

and the film_post.php file is:

  try
  {
$bdd = new PDO('mysql:host=localhost;dbname=website', 'root', 'root');
   }
  catch(Exception $e)
 {
    die('Erreur : '.$e->getMessage());
   }

    $option = $_POST['option'];
      $star = $_POST['star'];

    if ($option == film AND $star = 1) {
   $req = $bdd->prepare('INSERT INTO film (film, star) VALUES(?,?)');
     $req->execute(array($_POST['nom'],$_POST['star'] )); }

     elseif ($option == film AND $star = 2) {
    $req = $bdd->prepare('INSERT INTO film (film, star) VALUES(?,?)');
    $req->execute(array($_POST['nom'],$_POST['star'] )); }

     elseif ($option == film AND $star = 3) {
   req = $bdd->prepare('INSERT INTO film (film, star) VALUES(?,?)');
   $req->execute(array($_POST['nom'],$_POST['star'] )); }

Apparently I can't post images yet, so here's a link to the one I have talk about in my answer below. http://i.stack.imgur.com/xgExo.png

I executed your code, grabbing the necessary script src tags, which I assume you have in your actual code, and found the same problem you did. After looking at the firebug console, like jchapa suggested, I found what you can see in the images above.

The jquery ui you are using rewrites your from in such a way that not only does it give it those bubbly graphics but it also terminates your form tag prematurely, as seen where I have underlined the "" text.

How you fix this, I don't know, but that is where your problem lies. You might consider looking online for how to setup a form in this jquery ui or you might just build your own from dialog. Admittedly, though, the graphics won't be quite as sleek.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM