私が欲しいのは、ユーザーがリンクをクリックすると、一度に2つのテキストボックスが自動的に作成され、そこからクリックして無制限の数のテキストボックスを作成できることです。
意味 textboxA textboxB
このように......
私が望んでいた方法と非常によく似たコードをネット上で見つけました...しかし、2つのテキストボックスの代わりに、リンクをクリックすると一度に1つのテキストボックスしか作成されません最初に完全な元のコードを提供します...
1) index.php
<?php
//Include the database class
require("classes/db.class.php");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>jQuery</title>
<script type="text/javascript" src="js/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="css/css.css" />
<script type="text/javascript">
var count = 0;
$(function(){
$('p#add_field').click(function(){
count += 1;
$('#container').append(
'<strong>Link #' + count + '</strong><br />'
+ '<input id="field_' + count + '" name="fields[]' + '" type="text" /><br />' );
});
});
</script>
<body>
<?php
//If form was submitted
if (isset($_POST['btnSubmit'])) {
//create instance of database class
$db = new mysqldb();
$db->select_db();
//Insert static values into users table
$sql_user = sprintf("INSERT INTO users (Username, Password) VALUES ('%s','%s')",
mysql_real_escape_string($_POST['name']),
mysql_real_escape_string($_POST['password']) );
$result_user = $db->query($sql_user);
//Check if user has actually added additional fields to prevent a php error
if ($_POST['fields']) {
//get last inserted userid
$inserted_user_id = $db->last_insert_id();
//Loop through added fields
foreach ( $_POST['fields'] as $key=>$value ) {
//Insert into websites table
$sql_website = sprintf("INSERT INTO websites (Website_URL) VALUES ('%s')",
mysql_real_escape_string($value) );
$result_website = $db->query($sql_website);
$inserted_website_id = $db->last_insert_id();
//Insert into users_websites_link table
$sql_users_website = sprintf("INSERT INTO users_websites_link (UserID, WebsiteID) VALUES ('%s','%s')",
mysql_real_escape_string($inserted_user_id),
mysql_real_escape_string($inserted_website_id) );
$result_users_website = $db->query($sql_users_website);
}
} else {
//No additional fields added by user
}
echo "<h1>User Added, <strong>" . count($_POST['fields']) . "</strong> website(s) added for this user!</h1>";
//disconnect mysql connection
$db->kill();
}
?>
<?php if (!isset($_POST['btnSubmit'])) { ?>
<h1>New User Signup</h1>
<form name="test" method="post" action="">
<label for="name">Username:</label>
<input type="text" name="name" id="name" />
<div class="spacer"></div>
<label for="name">Password:</label>
<input type="text" name="password" id="password" />
<div class="spacer"></div>
<div id="container">
<p id="add_field"><a href="#"><span>» Add your favourite links.....</span></a></p>
</div>
<div class="spacer"></div>
<input id="go" name="btnSubmit" type="submit" value="Signup" class="btn" />
</form>
<?php } ?>
</body>
</html>
2) db.class.php
<?php
class mysqldb {
/*
FILL IN YOUR DATABASE DETAILS BEFORE RUNNING THE EXAMPLE
*/
var $hostname = "localhost";
var $username = "root";
var $password = "mypassword";
var $database = "unlimited";
function db_connect() {
$result = mysql_connect($this->hostname,$this->username,$this->password);
if (!$result) {
echo 'Connection to database server at: '.$this->hostname.' failed.';
return false;
}
return $result;
}
function select_db() {
$this->db_connect();
if (!mysql_select_db($this->database)) {
echo 'Selection of database: '.$this->database.' failed.';
return false;
}
}
function query($query) {
$result = mysql_query($query) or die("Query failed: $query<br><br>" . mysql_error());
return $result;
mysql_free_result($result);
}
function fetch_array($result) {
return mysql_fetch_array($result);
}
function num_rows($result) {
return mysql_num_rows($result);
}
function last_insert_id() {
return mysql_insert_id();
}
function kill() {
mysql_close();
}
}
?>
3) css.css
html, input {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 0.8em;}
body { width: 500px; margin: 50px auto 0 auto; display: block;}
h1 { font-size: 1.5em; color: #333; }
input { font-size: 0.9em; padding: 5px; border: 1px solid #ccc; margin: 0; display: block;}
a { text-decoration: none; color: #666; font-weight: bold; }
a:hover { color: #ff0000; }
#divTxt { width:400px; padding: 5px; }
p a img { border: none; vertical-align: middle; }
.spacer {clear: both; height: 10px; }
.btn { width: 90px; font-weight: bold; }
#container { border: 1px solid #ccc; padding: 2px; }
.clear {overflow: hidden;width: 100%;
}
4) JQUERY.js
このコードでは、前述のようにリンクをクリックしたときに 1 つのテキスト ボックスのみを動的に作成することが許可されているため、2 つのテキスト ボックスが必要なため、ページ内の jquery 部分をindex.php次のように編集しました...
<script type="text/javascript">
var count = 0;
$(function(){
$('p#add_field').click(function(){
count += 1;
$('#container').append(
'<strong>Link #' + count + '</strong><br />'
+ '<label for="fields[]' + '">Colour</label><input id="field_' + count + '" name="fields[]' + '" type="text" /><label for="fields2[]' + '">Quantity</label><input id="field2_' + count + '" name="fields2[]' + '" type="text" /><br />');
});
});
</script>
ここまでは成功しています...しかし、主な問題は、2つのテキストボックスの両方をmysqlテーブルに連続して保存できないことです..
このコードを確認して、回答が得られたら返信してください.....
受け入れられた回答として、有効な回答の緑色の矢印をクリックします..
みんな助けてください......