Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
313 views
in Technique[技术] by (71.8m points)

javascript - Populate a text box based on a dynamic drop down box in php

I am trying to input a value (Rating) from the database when an item is selected. I need to also be able to update that rating and then put that value into another table. My problem is that I'm trying to figure out how to make the value in the text box be related to the selection made in the drop down. I've found coding to make another option box but cannot figure out how to make that a text box.

REWORDING: Originally when I posted the question I thought it was possible to do this without JQuery and was trying to copy the for loop and run a while loop to populate the text box. I now know that isn't possible and would like to figure out how to run a script to populate a text box on change for the drop down box. The problem being the function has to be connected to the database as well as the drop down. 1. pull the data for the drop down (from the JOURNAL table). 2. Select a journal from that drop down 3. Inside the JOURNAL table a JournalRating has been assigned to every journal pull that value and place inside a textbox.

What I've tried to do is

<?php
    include 'dbc.php';
    connect();

    //insert form values into database                                                                                                                                                   
$sql = "SELECT JournalName, JournalID, Rating, JournalActive from JOURNAL where JournalActive = 1;";      
//Can take out JournalActive if we do not want it                                                                                                                        
$result = mysqli_query($conn, $sql);                                                                                                                                                 
if (!$result) {                                                                                                                                                                      
    $message  = 'Invalid query: ' . mysql_error() . "
";                                                                                                                            
    $message .= 'Whole query: ' . $query;                                                                                                                                            
    die($message);                                                                                                                                                                   
    echo "there was an issue";                                                                                                                                                       
} 

$sql2 = "SELECT FName, LName, FacultyID from FACULTY where FacultyActive = 1;"; 
//Can take out JournalActive if we do not want it                                                                                                                        
$result2 = mysqli_query($conn, $sql2);                                                                                                                                                 
if (!$result2) {                                                                                                                                                                      
    $message  = 'Invalid query: ' . mysql_error() . "
";                                                                                                                            
    $message .= 'Whole query: ' . $query;                                                                                                                                            
    die($message);                                                                                                                                                                   
    echo "there was an issue";                                                                                                                                                       
} 

    //array to hold all of the data                                                                                                                                                      
$journals = array();                                                                                                                                                                  
    //print out all of the first names in the database   
$rownumber = 0;                                                                                                                                 
while ($row = mysqli_fetch_assoc($result)) {                                                                                                                                         
    $journals[$rownumber][0] = $row['JournalName'];
    $journals[$rownumber][1] = $row['JournalID'];
    $journals[$rownumber][2] = $row['JournalRating'];
    $journals[$rownumber][3] = $row['JournalActive'];
    $rownumber++;                                                                                                                                                       
}

$faculty = array();                                                                                                                                                                  
    //print out all of the first names in the database   
$rownum = 0;                                                                                                                                 
while ($row = mysqli_fetch_assoc($result2)) {                                                                                                                                         
    $faculty[$rownum][0] = $row['FName'];
    $faculty[$rownum][1] = $row['LName'];
    $faculty[$rownum][2] = $row['FacultyID'];
    $rownum++;                                                                                                                                                       
}

?>

<!DOCTYPE html>

<head>
<link href="styles.css" rel="stylesheet">
<h1> Miami University </h1>
<h4> Information Systems and Analytics Department </h4>
<script>
(function($){
    $(function(){ 
        $("#JournalID").on('change', function() {
              $("#JournalRating").val($(this).find("option:selected").data('Rating'));
        });
    }); 
})(jQuery);
</script>

</head>
<body>

<div class="StyleDiv" > 
<!-- coding for journal -->
<form id="form1" name="form1" method="post" action="RR2.php">


<label for="FacultyID">Faculty Name</label>
<select multiple="multiple" name="FacultyID[]" id="FacultyID">
<?php
    for($i = 0; $i < sizeof($faculty); $i++) {
    print "<option value="" . $faculty[$i][2] . "">" . $faculty[$i][0] .' '. $faculty[$i][1] . "</option>
";
    }
?>
</select>


<br class="clear" />

<br class="clear" /> 
<label for="JournalID">Journal Name</label>
<select name="JournalID" id="JournalID">
<?php

    for($i = 0; $i < sizeof($journals); $i++) {
    print "<option value="" . $journals[$i][1] . "" data-rating="" . $journals[$i][2] . "">" . $journals[$i][0] . "</option>
";
}
?>
</select>
<br class="clear"/>

<label for="JournalRating">Journal Rating</label><input type="text" name="JournalRating" id="JournalRating" />

<br class="clear" /> 


<!-- coding for publication --> 
<label for="Title">Publication Title</label><input type="text" name="PubID" id="PubID" />
<br class="clear" /> 
<label for="Year">Year</label><input type="text" name="Year" id="Year" />
<br class="clear" /> 
<label for="Volume">Volume</label><input type="text" name="Volume" id="Volume" />
<br class="clear" /> 
<label for="Issue">Issue</label><input type="text" name="Issue" id="Issue" />
<br class="clear" /> 
<label for="Comments">Comments</label><textarea name="Comments" id="Comments" cols="45" rows="5"></textarea>
<br class="clear" /> 



<input type="submit" name="Submit" id="Submit" value="Submit" />
<br class="clear" /> 
</br>
</br>

</div>
</form>

<?php

//Post Parameters 
$JournalID = $_POST['JournalID'];
//for($i = 0; $i < sizeof($journals); $i++) {
    //if ($JournalID = $journals[$i][1]) {
    //$JournalName = $journals[$i][0];
    //}
    //}
$Year = $_POST['Year'];  
$Comments = $_POST['Comments'];  
$Volume = $_POST['Volume'];  
$Issue = $_POST['Issue'];  
$Title = $_POST['Title'];
$JournalRating = $_POST['JournalRating'];
$FacultyMemID = $_POST['FacultyID'];


//Query 



 //INSERT 
$stmt = $conn->prepare(" INSERT INTO PUBLICATION ( JournalID, Year, Comments, Volume, Issue, Title, JournalRating )  VALUES ( ?, ?, ?, ?, ?, ?, ? )"); 
$stmt->bind_param('sssssss', $JournalID, $Year, $Comments, $Volume, $Issue, $Title, $JournalRating);
$stmt->execute(); 

$pubID = $stmt->insert_id;
$facmemid = 0; 

$stmt = $conn->prepare(" INSERT INTO FACULTYPUBLICATIONS ( FacultyID, PubID )  VALUES ( ?, ? )"); 
$stmt->bind_param('ii', $facmemid, $pubID);
 //for ($_POST['FacultyID'] as $FacultyMemID) {
 for($i = 0; $i < sizeof($FacultyMemID); $i++) {
    $facmemid = $FacultyMemID[$i]; 
    $stmt->execute();
    }

mysqli_close($conn);
?>



</body>
</html>
See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Add the rating to your HTML using a data attribute:

<select name="JournalID" id="JournalID">
<?php
    for($i = 0; $i < sizeof($journals); $i++) {
    print "<option value="" . $journals[$i][1] . "" data-rating="" . $journals[$i][2] . "">" . $journals[$i][0] . "</option>
";
}
?>
</select>

Then you can access this using jQuery .data():

(function($) {
  $(function() {
    $("#JournalID").on('change', function() {
      $("#JournalRating").val($(this).find("option:selected").data('rating'));
    });
  });
})(jQuery);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="JournalID">
  <option>Select a journal</option>
  <option value="1" data-rating="3">Journal #1</option>
  <option value="2" data-rating="2">Journal #2</option>
  <option value="3" data-rating="5">Journal #3</option>
  </select>
<br>
Rating: <input id="JournalRating">

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...