>>  Site Map >>  Forums >>  PHP+MySql

Forum module - topics in forum:



PHP+MySql - Coding mã nguồn mở rât thông dụng để làm web, và hệ thống cơ sỏ dữ liệu rất mạnh duợc ưa chuộng



Select form Ajax + Mysql + PHP drop box

SOLVED -- see the ansewers

Mình muốn tạo 1 form đăng nhập.
Trong đó sẽ có select form ví dụ như bao gồm danh sách các lớp học trong 1 trường học . ( cái này mình làm rồi, đơn giản) nhưng, mình muốn có thêm chức năng : khi người dùng chọn được 1 option ( lớp học)trong danh sách đấy thì ngay phía dưới sẽ tự động xuất hiện 1 select form về danh sách học sinh của chính cái lớp vừa được chọn đấy. Mình suy nghĩ mãi nhưng không tìm được câu trả lời, các bạn giúp mình với nhé .




Ajax+php+mysql+java Dropdow box

mình chắc ràng dữ liệu bạn lấy tù Mysql data đẻ cap nhật cho các form phai không .. đây là giải pháp khá toàn vẹn tổng hợp mà mình đúc kêt được ..
đây là một bài mình đã post tại một số diễn đàn cả english lẫn việt để hỏi một câu hỏi tuơng tụ như bạn bạn có thê tham khảo

đến phút này thì mình đã tìm đuợc giải pháp toàn ven.. mong các bạn đọc wa
chào các bạn bài này mìng tổng họp tù một post của txtlover(3file + ajax) và thêm mộ giải pháp nũa của mình chỉ một file( dùng array mảng của java).. dể tạo hai drop box .. liên kết tới data mysql.. khi mọt box dc chọn thì box kia sẽ hiện sub value của box1 kêt nói với nhau bỏi chung id..


fist: i got two table in mysql data i cut in simple for easy coding this..
Quote: :
table1 -------- catID| title
*record1-table1: 1 | aaa
*record2-table1: 2 | bbb
-----------------------------------
table2 ------- topicID| topictext| catID
*record1-table2: 1 | ccc | 1
*record2-table2: 2 | ddd | 1
*record3-table2: 2 | eee | 2


i'm trying to creat two drop box list link together by catid
when i chose one value from fist box and the second box will viewed the record with catid the same.. two box will send its value when submit the form by its name..( in format of number like catid and topicid )
i put my sql here for some one easy test:

Quote: :
CREATE TABLE `veryzoo_stories_cat` (
`catid` int(11) NOT NULL auto_increment,
`title` varchar(20) NOT NULL default '',
PRIMARY KEY (`catid`),
KEY `catid` (`catid`)
) TYPE=MyISAM;
CREATE TABLE `veryzoo_topics` (
`topicid` int(3) NOT NULL auto_increment,
`topictext` varchar(40) default NULL,
`catid` int(11) NOT NULL default '0',
PRIMARY KEY (`topicid`),
KEY `topicid` (`topicid`)
) TYPE=MyISAM;


and then add some record for them..
bạn có thể dùng php myadmin hoạc câu lẹnh mysql đẻ thêm datta vào làm ví dụ nhá


_______________
cách một: dung một file index.php để test

bạn bỏ các dấu *** trong doạn code nhá forums không cho kèm php vì an toàn


Code: :

<***?***
mysql_connect("localhost", "root", "pass") ;
mysql_select_db("yourdata") ;

//////////////////
echo "<script type=\"text/javascript\">\n";
echo "var arrTopic= new Array();\n";
// Hiển thị dropdownlist Topic ứng với catid
echo "function HienThiTopic(catid){\n";
echo "   var topic; var html = \"<select  size='5' name='topic'>\";\n";
echo "   html += \"<option value='0'>---- - Select Topic - ----</option>;\"\n";
echo "    for(i=0; i<arrTopic.length; i++){\n";
echo "      topic = arrTopic[i];\n";
echo "        if(topic.catId == catid){ html += \"<option value='\" + topic.id + \"'>\" + topic.title + \"</option>\" ;}\n";
echo "    }\n";
echo "    html += \"</select\";\n";
echo "    return html;\n";
echo "}\n";
//end hien thi tuong ung
echo "function Topic(id, title, catId){ this.id = id;  this.title = title;  this.catId = catId; }\n";
echo "function cat_change(id) { document.getElementById(\"view_topic\").innerHTML = HienThiTopic(id); }\n";
//////////////////////////////////////////
////// this creat dimetion for topics list
    $result=mysql_query("SELECT * FROM veryzoo_topics");
    $du_lieu = "";
    $i=0;
    while($row = mysql_fetch_assoc($result))
    {
    $topicid = $row['topicid'];
    $topictext = $row['topictext'];
    $catid = $row['catid'];
    $du_lieu .= "\n arrTopic[$i] = new Topic($topicid, '$topictext', $catid);";
    $i++;
    }
    echo $du_lieu;
/// end creat dimention
echo "\n</script>\n";
/// end prepare scipt for topic
$resultcat=mysql_query("SELECT * FROM veryzoo_stories_cat") ;
///// this can line out
echo "<form method=\"post\" action=\"test.php\">\n";
////
echo "<select id=\"catid\" name =\"catid\" onchange=\"cat_change(this.value);\">\n";
    while($row = mysql_fetch_assoc($resultcat))
    {
            echo "<option value=" . $row['catid'] . ">" . $row['title'] . "</option>\n" ;
    }   
echo "</select>\n";
echo "<div id=\"view_topic\">-- the topics will be viewed affter you chosed category </div>\n";
/// this out
echo "<input type=\"submit\" name=\"Submit\" value=\"Submit\">";
echo "</form>";
////

?***>


_____
________________
Giải pháp 2 là dùng 4 file :
sủ dụng 4 file .. index.php , ajax.php , topics.php, test.php

file index.php : bạn có thể clean bớt và chuyen hêt qua php cũng đuợc bàng sài echo"";
Code: :
<***?
mysql_connect("localhost", "root", "pass") ;
mysql_select_db("yourdata") ;
$result=mysql_query("SELECT * FROM veryzoo_stories_cat") ;
?***>

<***html><head>
<script src="ajax.js"></script>
</head><body><label>
<form method="post" action="test.php">
<select name="catid" id="catid" onChange="javascript:sndReq();" value="0" selected>
<?php
    while($row = mysql_fetch_assoc($result))
    {
            echo "<option value=" . $row['catid'] . ">" . $row['title'] . "</option>" ;
    }   
?****>
</select>
<div id="topics">second dropdown will appear here</div>
<div id="info">infor of chosen here</div>
<input type="submit" name="Submit" value="Submit">
</form></label>
</body></html****>



++file: ajax.js
Code: :

###############
function createRequestObject() {
    var ro;
    var browser = navigator.appName;
    if(browser == "Microsoft Internet Explorer"){
        ro = new ActiveXObject("Microsoft.XMLHTTP");
    }else{
        ro = new XMLHttpRequest();
    }
    return ro;
}
var http = createRequestObject();
function sndReq() {
    var catidnow ;   
    catidnow = document.getElementById('catid').value ;
    http.open('get', 'topics.php?catidnow='+catidnow);
    http.onreadystatechange = handleResponse;
    http.send(null);
    display_result();
}

function handleResponse()
{
    if(http.readyState == 4)
    {
        var response = http.responseText;
        document.getElementById('topics').innerHTML = response;
    }
}

#############



---------------
files topics.php


Code: :
<****?php
mysql_connect("localhost", "root", "pass") ;
mysql_select_db("yourdata") ;
$catid = $_GET['catidnow'] ;
//if($catid == NULL){ $catid=0;}
$result=mysql_query("SELECT * FROM veryzoo_topics WHERE catid = $catid") ;
echo "<select name='topic' id='topic' onChange=\"display_result()\" size=\"5\">";
echo "<option> << chose your cat fist</option>";
    while($row = mysql_fetch_assoc($result))
    {
            echo "<option value=" . $row['topicid'] . ">" . $row['topictext'] . "</option>" ;
    }   
echo "</select>" ;
?***>


====
và một file test.php nũa để thử kết quả coi ra sao..
Code: :
<***?php
$catidfinal = $_POST['catid'] ;
$topicidfinal = $_POST['topic'] ;

echo "cat: " . $catid . "<br>";
echo "Topic: " . $topic ;
?***>


nếu bạn sưu tầm các bài học php ỏ đâu thì post vào diẽn đàn nhá .. xã luận đan rất cần thêm nhìu bài như vậy
chúc vui




một giải pháp khác không dùng data cho dropdow box

một giải pháp khác
Mình có thể làm 2 dropbox link với nhau theo cách lấy dữ liệu topic một lần và lưu vào mảng. Sau đó dùng javascript để hiển thị dropbox Topic ứng với catid.
download một file sau
giải pháp đơn giản không dùng data mysql cho bạn dễ hiểu .. và sửa theo ý mình ..
Arrow






Cám ơn 2 bạn đã giúp đỡ mình, nhờ những cách giải quyết của 2 bạn mà mình đã giải quyết được vấn đề hoc búa này, hihi, lúc nào có việc mình lại xin chỉ giáo nhé.




Search from ALEXA


put your ads here