samuel_lopez Posted October 17, 2015 Share Posted October 17, 2015 Hi to all,I'm newbie in using javascript,I want to ask if how can I pass pop up text value to it's assigned textbox. I used php to display data. KIndly check attached image below, Assuming I have 3 values to database and I had retrieve it. this is my form <script> function popup{ var remarks= prompt("Enter Remarks"); var remarks= prompt("Enter filename"); } </script> <form method="post"> <tr align="center"> <div class="tdportion"> <td class="tdportion1"><?php echo $row['student_id']; ?></td> <td class="tdportion1"><?php echo $row['student_name']; ?></td> </div> <td><input type="radio" name="testcase[<?php echo $row['student_id'] ?>]" value="Passed"> Very Good </td> <td><input type="radio" name="testcase[<?php echo $row['student_id'] ?>]" value="Good" onclick="popup"> Good </td> <td><input type="radio" name="testcase[<?php echo $row['student_id'] ?>]" value="Average" onclick="popup")> Average </td> <td><input type="text" name="remarks"/></td> <td><input type="text" name="filename"/></td> --></tr> <?php }; ?> <tr><td><input type="submit" name="save" value="Save all"></td></tr> </form> My process is: when radio button Good and Average is clicked, then pop up will show to enter your remarks and document. I was stuck on how to pass pop up value to its assigned textbox. Your response is much appreciated. Thank you. Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/ Share on other sites More sharing options...
Ch0cu3r Posted October 17, 2015 Share Posted October 17, 2015 Why have a prompt if you are providing a text field? I feel that is unnecessary. How about apply the required html5 attribute to the remarks and filename text fields. That way when the user attempts to submit the form the browser will highlight those text fields informing the user they must enter a value if they have left them blank. Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523561 Share on other sites More sharing options...
samuel_lopez Posted October 19, 2015 Author Share Posted October 19, 2015 Hi Ch0cu3r, your suggestion is good but I have to follow my own design/process. The text boxes in the future will be hidden so that when the user clicked failed or good radio button, the user will prompt a text box to enter remarks and file. the remarks and file data will be passed to hidden text boxes for saving. Please help me. Thank you. . Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523649 Share on other sites More sharing options...
samuel_lopez Posted October 19, 2015 Author Share Posted October 19, 2015 (edited) This is my updated function for passing on remarks textbox <script type="text/javascript"> function popup(form) { var reason = prompt("Enter remarks"); for (var i = 0; i < form.testcase.length; i++) { if(form.testcase.checked) { var full = form.testcase.name; document.getElementsByName("remarks["+ full +"]")[0].value = reason; } } } </script> but in only over write the first textbox. Edited October 19, 2015 by samuel_lopez Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523650 Share on other sites More sharing options...
Ch0cu3r Posted October 19, 2015 Share Posted October 19, 2015 You need to name your remarks and filename fields with the same student id as your radio buttons <td><input type="text" name="remarks[<?php echo $row['student_id'] ?>]" /></td> <td><input type="text" name="filename[<?php echo $row['student_id'] ?>]" /></td> Now when the user clicks the radio button you can need to only populate the remarks and filename textfields that use the same student id in thename. To handle this I would use Jquery <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <script type="text/javascript"> $(function() { $('input[type=radio]').on('click', function(e) { // get the radio button name attribute value for the radio button that was clicked on name = $(this).attr('name'); // extract the student id from from the radio button name student_id = name.match(/\d+/)[0]; // target the remarks and filename textfields that are associated with the same student id remarksField = $('input[name="remarks['+student_id+']"]'); filenameField = $('input[name="filename['+student_id+']"]'); // display remark prompt and populate the prompt with the existing value enteredRemark = prompt('Enter your remark', remarksField.val()); // display filename prompt and populate the prompt with the existing value enteredFilename = prompt('Enter your filename', filenameField.val()); // apply the values for the remarks and filename textfields remarksField.val(enteredRemark); filenameField.val(enteredFilename); }); })(); </script> See Live Demo Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523651 Share on other sites More sharing options...
samuel_lopez Posted October 19, 2015 Author Share Posted October 19, 2015 (edited) HI Ch0cu3r, thank you for the fix but for "Very good" radio button, It should have no prompt..Please help. Thanks Edited October 19, 2015 by samuel_lopez Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523661 Share on other sites More sharing options...
samuel_lopez Posted October 19, 2015 Author Share Posted October 19, 2015 I got an error "Uncaught TypeError: $(...) is not a function" Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523666 Share on other sites More sharing options...
Ch0cu3r Posted October 19, 2015 Share Posted October 19, 2015 (edited) I got an error "Uncaught TypeError: $(...) is not a function" Make sure you are loading Jquery into your page before that code Edit On the last line before </script> remove the characters in red })(); but for "Very good" radio button, It should have no prompt. Change $('input[type=radio]').on('click', function(e) { ... code ... }); to be $('input[type=radio]').on('click', function(e) { // if this radio button value is not Passed if($(this).val() != "Passed") { ... code ... } }); Edited October 19, 2015 by Ch0cu3r Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523667 Share on other sites More sharing options...
samuel_lopez Posted October 19, 2015 Author Share Posted October 19, 2015 (edited) Hi Ch0cu3r,No value were passed to remarks and filename. this is my current code <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <script type="text/javascript"> $(function() { $('input[type=radio]').on('click', function(e) { if($(this).val() != "Passed") { // get the radio button name attribute value for the radio button that was clicked on name = $(this).attr('name'); // extract the student id from from the radio button name stud_ids = name.match(/\d+/)[0]; // target the remarks and filename textfields that are associated with the same student id remarksField = $('input[name="remarks['+stud_ids+']"]'); filenameField = $('input[name="filename['+stud_ids+']"]'); // display remark prompt and populate the prompt with the existing value enteredRemark = prompt('Enter your remarks', remarksField.val()); // display filename prompt and populate the prompt with the existing value enteredFilename = prompt('Enter your filename', filenameField.val()); // apply the values for the remarks and filename textfields remarksField.val(enteredRemark); filenameField.val(enteredFilename); } }); }); </script> <td><?php echo $row['student_id'] ?></td> <td class="tdportion1"><?php echo $row['student_id']; ?></td> <td class="tdportion1"><?php echo $row['student_name']; ?></td> <td><input type="radio" name="testcase[<?php echo $row['student_id'] ?>]" value="Passed"> Very Good </td> <td><input type="radio" name="testcase[<?php echo $row['student_id'] ?>]" value="Good" onclick="prompt"> Good </td> <td><input type="radio" name="testcase[<?php echo $row['student_id'] ?>]" value="Average" onclick="prompt"> Average </td> <td><input type="text" name="remarks[<?php echo $row['student_id'] ?>]" /></td> <td><input type="text" name="filename[<?php echo $row['student_id'] ?>]" /></td> Edited October 19, 2015 by samuel_lopez Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523670 Share on other sites More sharing options...
Ch0cu3r Posted October 19, 2015 Share Posted October 19, 2015 Remove the onclick="prompt" from your radio buttons you don't need that now. The javascript should either be placed between the <head></head> tags or before the closing </body> tag Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523671 Share on other sites More sharing options...
samuel_lopez Posted October 19, 2015 Author Share Posted October 19, 2015 (edited) When I alert the stud_ids = name.match(/\d+/)[0]; it only show 1 for s-01, i thought that was the error? Edited October 19, 2015 by samuel_lopez Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523672 Share on other sites More sharing options...
Ch0cu3r Posted October 19, 2015 Share Posted October 19, 2015 (edited) Oh the grade id in your screenshot is the $row['student_id'] value. In that case change stud_ids = name.match(/\d+/)[0]; to be stud_ids = name.match(/\[(.*)\]/)[1]; Edited October 19, 2015 by Ch0cu3r Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523677 Share on other sites More sharing options...
samuel_lopez Posted October 20, 2015 Author Share Posted October 20, 2015 Hi Ch0cu3r, how can I change prompt to textbox pop up? Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523841 Share on other sites More sharing options...
Ch0cu3r Posted October 21, 2015 Share Posted October 21, 2015 I don't understand what do you mean by that? Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523885 Share on other sites More sharing options...
samuel_lopez Posted October 21, 2015 Author Share Posted October 21, 2015 I want to replace prompt to pop up textbox Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523891 Share on other sites More sharing options...
samuel_lopez Posted October 21, 2015 Author Share Posted October 21, 2015 Hi, I changed <td><input type="text" name="filename[<?php echo $row['student_id'] ?>]" /></td> <td><input type="file" name="filename[<?php echo $row['student_id'] ?>]" /></td> How can I save it to database? Please help. Thank you Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523895 Share on other sites More sharing options...
Ch0cu3r Posted October 21, 2015 Share Posted October 21, 2015 I want to replace prompt to pop up textbox You can not customize the javascript prompt. However you can create your own custom popup windows the modern way is to create a modal window Hi, I changed <td><input type="text" name="filename[<?php echo $row['student_id'] ?>]" /></td> <td><input type="file" name="filename[<?php echo $row['student_id'] ?>]" /></td> How can I save it to database? Please help. Thank you I assume you mean the file upload. If so then please read the following chapter Handling file uploads in the php manual it explains how PHP handles file uploads. When saving the uploaded file to the database you should only be storing the filename (or path to the file). The file itself should stored on the servers file system. Why is there two different fields named filename? Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523907 Share on other sites More sharing options...
samuel_lopez Posted October 21, 2015 Author Share Posted October 21, 2015 (edited) File not move to target folder. foreach ($testcase as $ids => $result ) // echo $id; //echo $result; { $remarks = $_POST['remarks'][$ids]; $filename = $_POST['filename'][$ids]; $file = $_FILES['filename']['name']; $file_loc = $_FILES['filename']['tmp_name']; $file_size = $_FILES['filename']['size']; $file_type = $_FILES['filename']['type']; $folder="studentdocument/"; // new file size in KB $new_size = $file_size/1024; // new file size in KB // make file name in lower case $new_file_name = strtolower($file); // make file name in lower case $final_file=str_replace(' ','-',$new_file_name); if(move_uploaded_file($file_loc,$folder.$final_file)){ //insert statement } } Edited October 21, 2015 by Ch0cu3r Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523909 Share on other sites More sharing options...
Ch0cu3r Posted October 21, 2015 Share Posted October 21, 2015 As you have named your file field as filename[<?php echo $row['student_id'] ?>] You need to add the student id to the $_FILES array $file = $_FILES['filename']['name'][$ids]; $file_loc = $_FILES['filename']['tmp_name'][$ids]; $file_size = $_FILES['filename']['size'][$ids]; $file_type = $_FILES['filename']['type'][$ids]; Next make sure the studentdocument/ directory exists and is in the same directory as your php file that is processing the upload. You may also need to set the necessary file permissions to allow PHP to write that directory too. Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1523932 Share on other sites More sharing options...
samuel_lopez Posted October 22, 2015 Author Share Posted October 22, 2015 Hi Ch0cu3r, I want to change my promt to a textbox popup. how can I do that? this is the current codeenteredRemark = prompt('Enter your remarks', remarksField.val()); Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1524007 Share on other sites More sharing options...
samuel_lopez Posted November 3, 2015 Author Share Posted November 3, 2015 Hi all, i have a problem on how to pass sweet alert prompt value to another textbox.Please refer to https://limonte.github.io/sweetalert2/. this is my code remarksField = $('input[name="remarks['+testcase+']"]'); filenameField = $('input[name="filename['+testcase+']"]'); //enteredRemark = prompt('Enter your remarks', remarksField.val()); swal({ title: 'Input something', html: '<p><input id="input-field">', showCancelButton: true, closeOnConfirm: false }, function() { swal({ html: 'You entered:' + $('#input-field').val() }); remarksField.val(#input-field').val()); Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1525282 Share on other sites More sharing options...
Ch0cu3r Posted November 3, 2015 Share Posted November 3, 2015 (edited) I have merged your two topics as this is continuation from last time. The textbox value needs to be set in swal's callback function. So replace the following function() { swal({ html: 'You entered:' + $('#input-field').val() }); remarksField.val(#input-field').val()); With function() { remarksField.val( $('#input-field').val() ); }); Also closeOnConfirm: needs to be set to true Edited November 3, 2015 by Ch0cu3r Quote Link to comment https://forums.phpfreaks.com/topic/298659-how-to-pass-pop-up-prompt-value-to-its-assigned-textbox/#findComment-1525299 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.