Displaying form data on a bootstrap modal using javascriptHow do JavaScript closures work?What is the most efficient way to deep clone an object in JavaScript?Which “href” value should I use for JavaScript links, “#” or “javascript:void(0)”?How do I remove a property from a JavaScript object?Which equals operator (== vs ===) should be used in JavaScript comparisons?How do I include a JavaScript file in another JavaScript file?What does “use strict” do in JavaScript, and what is the reasoning behind it?How to check whether a string contains a substring in JavaScript?How do I remove a particular element from an array in JavaScript?For-each over an array in JavaScript?

Server Integrity Check CheckCommands question

How do I feed my black hole?

Why is "-ber" the suffix of the last four months of the year?

Nothing like a good ol' game of ModTen

Boot Windows from SAN

Why did Khan ask Admiral James T. Kirk about Project Genesis?

What is the loud noise of a helicopter when the rotors are not yet moving?

Can $! cause race conditions when used in scripts running in parallel?

Movie where people enter a church but find they can't leave, not in English

How to check whether a sublist exist in a huge database lists in a fast way?

Could this kind of inaccurate sacrifice be countered?

How many lines of code does the original TeX contain?

Cooking Scrambled Eggs

What is a natural problem in theory of computation?

Billiard balls collision

Hangman game in Python - need feedback on the quality of code

Is gzip atomic?

Can an Arcane Focus be embedded in one's body?

Talk interpreter

"There were either twelve sexes or none."

"Opusculum hoc, quamdiu vixero, doctioribus emendandum offero."?

How does the OS tell whether an "Address is already in use"?

Possessive of multiple words

Can RMSE and MAE have the same value?



Displaying form data on a bootstrap modal using javascript


How do JavaScript closures work?What is the most efficient way to deep clone an object in JavaScript?Which “href” value should I use for JavaScript links, “#” or “javascript:void(0)”?How do I remove a property from a JavaScript object?Which equals operator (== vs ===) should be used in JavaScript comparisons?How do I include a JavaScript file in another JavaScript file?What does “use strict” do in JavaScript, and what is the reasoning behind it?How to check whether a string contains a substring in JavaScript?How do I remove a particular element from an array in JavaScript?For-each over an array in JavaScript?






.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;








0















I am trying to show data selected from a dropdown menu and a button on to a bootstrap modal which is acting as a way to confirm the submission. When I press the button the modal appears, but the values from the form do not appear on the modal, my code is as follows:



HTML



<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="POST" id="apentry" name="apentry">

<div class="btn-group" role="group">

<select class="form-control" id="weekstarting" name="weekstarting">
<option value="one">Week starting: </option>
<option value="one"><?php echo $week1 ?></option>
<option value="two"><?php echo $week2 ?></option>
<option value="three"><?php echo $week3 ?></option>
<option value="four"><?php echo $week4 ?></option>
</select>
</div>


<div class="btn-group-vertical" role="group">
<h3> Mon </h3>

<input type="button" class="<?php echo $buttoncolour[0] ?>" name= "time_pickedm" value = "9:00" data-toggle="modal" data-target="#confirm-submit"/>

</div>


js



 $('#submitBtn').click(function() 
/* when the button in the form, display the entered values in the modal */
$('#timepicked').text($('#time_pickedm').val());
$('#weekname').text($('#weekstarting').val());

);

$('#submit').click(function()
/* when the submit button in the modal is clicked, submit the form */
alert('submitting');
$('#apentry').submit();
);


modal



<div class="modal fade" id="confirm-submit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
Confirm Submit
</div>
<div class="modal-body">
Are you sure you want to submit the following details?

<!-- We display the details entered by the user here -->
<table class="table">
<tr>
<th>Week</th>
<td id="weekname"></td>
</tr>
<tr>
<th>Time</th>
<td id="time_pickedm"></td>
</tr>
</table>

</div>

<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<a href="#" id="submit" class="btn btn-success success">Submit</a>
</div>
</div>
</div>
</div>


Any help would be appreciated










share|improve this question
































    0















    I am trying to show data selected from a dropdown menu and a button on to a bootstrap modal which is acting as a way to confirm the submission. When I press the button the modal appears, but the values from the form do not appear on the modal, my code is as follows:



    HTML



    <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="POST" id="apentry" name="apentry">

    <div class="btn-group" role="group">

    <select class="form-control" id="weekstarting" name="weekstarting">
    <option value="one">Week starting: </option>
    <option value="one"><?php echo $week1 ?></option>
    <option value="two"><?php echo $week2 ?></option>
    <option value="three"><?php echo $week3 ?></option>
    <option value="four"><?php echo $week4 ?></option>
    </select>
    </div>


    <div class="btn-group-vertical" role="group">
    <h3> Mon </h3>

    <input type="button" class="<?php echo $buttoncolour[0] ?>" name= "time_pickedm" value = "9:00" data-toggle="modal" data-target="#confirm-submit"/>

    </div>


    js



     $('#submitBtn').click(function() 
    /* when the button in the form, display the entered values in the modal */
    $('#timepicked').text($('#time_pickedm').val());
    $('#weekname').text($('#weekstarting').val());

    );

    $('#submit').click(function()
    /* when the submit button in the modal is clicked, submit the form */
    alert('submitting');
    $('#apentry').submit();
    );


    modal



    <div class="modal fade" id="confirm-submit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
    <div class="modal-content">
    <div class="modal-header">
    Confirm Submit
    </div>
    <div class="modal-body">
    Are you sure you want to submit the following details?

    <!-- We display the details entered by the user here -->
    <table class="table">
    <tr>
    <th>Week</th>
    <td id="weekname"></td>
    </tr>
    <tr>
    <th>Time</th>
    <td id="time_pickedm"></td>
    </tr>
    </table>

    </div>

    <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
    <a href="#" id="submit" class="btn btn-success success">Submit</a>
    </div>
    </div>
    </div>
    </div>


    Any help would be appreciated










    share|improve this question




























      0












      0








      0








      I am trying to show data selected from a dropdown menu and a button on to a bootstrap modal which is acting as a way to confirm the submission. When I press the button the modal appears, but the values from the form do not appear on the modal, my code is as follows:



      HTML



      <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="POST" id="apentry" name="apentry">

      <div class="btn-group" role="group">

      <select class="form-control" id="weekstarting" name="weekstarting">
      <option value="one">Week starting: </option>
      <option value="one"><?php echo $week1 ?></option>
      <option value="two"><?php echo $week2 ?></option>
      <option value="three"><?php echo $week3 ?></option>
      <option value="four"><?php echo $week4 ?></option>
      </select>
      </div>


      <div class="btn-group-vertical" role="group">
      <h3> Mon </h3>

      <input type="button" class="<?php echo $buttoncolour[0] ?>" name= "time_pickedm" value = "9:00" data-toggle="modal" data-target="#confirm-submit"/>

      </div>


      js



       $('#submitBtn').click(function() 
      /* when the button in the form, display the entered values in the modal */
      $('#timepicked').text($('#time_pickedm').val());
      $('#weekname').text($('#weekstarting').val());

      );

      $('#submit').click(function()
      /* when the submit button in the modal is clicked, submit the form */
      alert('submitting');
      $('#apentry').submit();
      );


      modal



      <div class="modal fade" id="confirm-submit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
      <div class="modal-dialog">
      <div class="modal-content">
      <div class="modal-header">
      Confirm Submit
      </div>
      <div class="modal-body">
      Are you sure you want to submit the following details?

      <!-- We display the details entered by the user here -->
      <table class="table">
      <tr>
      <th>Week</th>
      <td id="weekname"></td>
      </tr>
      <tr>
      <th>Time</th>
      <td id="time_pickedm"></td>
      </tr>
      </table>

      </div>

      <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
      <a href="#" id="submit" class="btn btn-success success">Submit</a>
      </div>
      </div>
      </div>
      </div>


      Any help would be appreciated










      share|improve this question
















      I am trying to show data selected from a dropdown menu and a button on to a bootstrap modal which is acting as a way to confirm the submission. When I press the button the modal appears, but the values from the form do not appear on the modal, my code is as follows:



      HTML



      <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="POST" id="apentry" name="apentry">

      <div class="btn-group" role="group">

      <select class="form-control" id="weekstarting" name="weekstarting">
      <option value="one">Week starting: </option>
      <option value="one"><?php echo $week1 ?></option>
      <option value="two"><?php echo $week2 ?></option>
      <option value="three"><?php echo $week3 ?></option>
      <option value="four"><?php echo $week4 ?></option>
      </select>
      </div>


      <div class="btn-group-vertical" role="group">
      <h3> Mon </h3>

      <input type="button" class="<?php echo $buttoncolour[0] ?>" name= "time_pickedm" value = "9:00" data-toggle="modal" data-target="#confirm-submit"/>

      </div>


      js



       $('#submitBtn').click(function() 
      /* when the button in the form, display the entered values in the modal */
      $('#timepicked').text($('#time_pickedm').val());
      $('#weekname').text($('#weekstarting').val());

      );

      $('#submit').click(function()
      /* when the submit button in the modal is clicked, submit the form */
      alert('submitting');
      $('#apentry').submit();
      );


      modal



      <div class="modal fade" id="confirm-submit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
      <div class="modal-dialog">
      <div class="modal-content">
      <div class="modal-header">
      Confirm Submit
      </div>
      <div class="modal-body">
      Are you sure you want to submit the following details?

      <!-- We display the details entered by the user here -->
      <table class="table">
      <tr>
      <th>Week</th>
      <td id="weekname"></td>
      </tr>
      <tr>
      <th>Time</th>
      <td id="time_pickedm"></td>
      </tr>
      </table>

      </div>

      <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
      <a href="#" id="submit" class="btn btn-success success">Submit</a>
      </div>
      </div>
      </div>
      </div>


      Any help would be appreciated







      javascript php html bootstrap-modal






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited Mar 27 at 19:34







      George Smith

















      asked Mar 27 at 19:01









      George SmithGeorge Smith

      305 bronze badges




      305 bronze badges

























          0






          active

          oldest

          votes










          Your Answer






          StackExchange.ifUsing("editor", function ()
          StackExchange.using("externalEditor", function ()
          StackExchange.using("snippets", function ()
          StackExchange.snippets.init();
          );
          );
          , "code-snippets");

          StackExchange.ready(function()
          var channelOptions =
          tags: "".split(" "),
          id: "1"
          ;
          initTagRenderer("".split(" "), "".split(" "), channelOptions);

          StackExchange.using("externalEditor", function()
          // Have to fire editor after snippets, if snippets enabled
          if (StackExchange.settings.snippets.snippetsEnabled)
          StackExchange.using("snippets", function()
          createEditor();
          );

          else
          createEditor();

          );

          function createEditor()
          StackExchange.prepareEditor(
          heartbeatType: 'answer',
          autoActivateHeartbeat: false,
          convertImagesToLinks: true,
          noModals: true,
          showLowRepImageUploadWarning: true,
          reputationToPostImages: 10,
          bindNavPrevention: true,
          postfix: "",
          imageUploader:
          brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
          contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
          allowUrls: true
          ,
          onDemand: true,
          discardSelector: ".discard-answer"
          ,immediatelyShowMarkdownHelp:true
          );



          );













          draft saved

          draft discarded


















          StackExchange.ready(
          function ()
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55384703%2fdisplaying-form-data-on-a-bootstrap-modal-using-javascript%23new-answer', 'question_page');

          );

          Post as a guest















          Required, but never shown

























          0






          active

          oldest

          votes








          0






          active

          oldest

          votes









          active

          oldest

          votes






          active

          oldest

          votes




          Is this question similar to what you get asked at work? Learn more about asking and sharing private information with your coworkers using Stack Overflow for Teams.







          Is this question similar to what you get asked at work? Learn more about asking and sharing private information with your coworkers using Stack Overflow for Teams.



















          draft saved

          draft discarded
















































          Thanks for contributing an answer to Stack Overflow!


          • Please be sure to answer the question. Provide details and share your research!

          But avoid


          • Asking for help, clarification, or responding to other answers.

          • Making statements based on opinion; back them up with references or personal experience.

          To learn more, see our tips on writing great answers.




          draft saved


          draft discarded














          StackExchange.ready(
          function ()
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55384703%2fdisplaying-form-data-on-a-bootstrap-modal-using-javascript%23new-answer', 'question_page');

          );

          Post as a guest















          Required, but never shown





















































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown

































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown







          Popular posts from this blog

          Kamusi Yaliyomo Aina za kamusi | Muundo wa kamusi | Faida za kamusi | Dhima ya picha katika kamusi | Marejeo | Tazama pia | Viungo vya nje | UrambazajiKuhusu kamusiGo-SwahiliWiki-KamusiKamusi ya Kiswahili na Kiingerezakuihariri na kuongeza habari

          Swift 4 - func physicsWorld not invoked on collision? The Next CEO of Stack OverflowHow to call Objective-C code from Swift#ifdef replacement in the Swift language@selector() in Swift?#pragma mark in Swift?Swift for loop: for index, element in array?dispatch_after - GCD in Swift?Swift Beta performance: sorting arraysSplit a String into an array in Swift?The use of Swift 3 @objc inference in Swift 4 mode is deprecated?How to optimize UITableViewCell, because my UITableView lags

          Access current req object everywhere in Node.js ExpressWhy are global variables considered bad practice? (node.js)Using req & res across functionsHow do I get the path to the current script with Node.js?What is Node.js' Connect, Express and “middleware”?Node.js w/ express error handling in callbackHow to access the GET parameters after “?” in Express?Modify Node.js req object parametersAccess “app” variable inside of ExpressJS/ConnectJS middleware?Node.js Express app - request objectAngular Http Module considered middleware?Session variables in ExpressJSAdd properties to the req object in expressjs with Typescript