홈>
SQL 쿼리를 실행하기 위해 일부 변수를 PHP 파일에 전달하려고합니다. 그러나 JavaScript는 이러한 변수를 객체로 전달합니다. 왜 이런 일이 발생합니까? 어떻게 바꾸나요?
<?php include 'dbconfig.php';?>
<?php header('Content-Type: text/html; charset=utf-8');?>
<!DOCTYPE HTML PUCLIC "-//W3C//DTDHTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>LIBRARY DATABASE</TITLE>
<link rel="stylesheet" type="text/css" href="mytable.css">
<link rel="stylesheet" type="text/css" href="styles.css">
<link rel="stylesheet" type="text/css" href="jquerycss.css">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="http://code.jquery.com/jquery-1.8.3.js" type="text/javascript"></script>
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
var new_dialog = function (type, row) {
var dlg = $("#dialog-form").clone();
var memberID = dlg.find(("#memberID")),
MFirst = dlg.find(("#MFirst")),
MLast = dlg.find(("#Mlast")),
Street = dlg.find(("#Street")),
number = dlg.find(("#number")),
postalCode = dlg.find(("#postalCode")),
Mbirthdate = dlg.find(("#Mbirthdate"));
type = type || 'Create';
var config = {
autoOpen: true,
height: 500,
width: 600,
modal: true,
buttons: {
"Create an account": save_data,
"Cancel": function () {
dlg.dialog("close");
}
},
close: function () {
dlg.remove();
}
};
if (type === 'Edit') {
config.title = "Edit User";
get_data();
delete (config.buttons['Create an account']);
config.buttons['Edit account'] = function () {
window.open("edituple.php?memberID="+ memberID +"&MFirst=" + MFirst +"&MLast=" + MLast +"&Street=" + Street
+"&number=" + number + "&postalCode=" + postalCode +"&Mbirthdate=" + Mbirthdate);
dlg.dialog("close");
};
}
dlg.dialog(config);
function get_data() {
var _memberID = $(row.children().get(1)).text(),
_MFirst = $(row.children().get(2)).text(),
_MLast = $(row.children().get(3)).text(),
_Street = $(row.children().get(4)).text(),
_number = $(row.children().get(5)).text(),
_postalCode = $(row.children().get(6)).text(),
_Mbirthdate = $(row.children().get(7)).text();
memberID.val(_memberID);
MFirst.val(_MFirst);
MLast.val(_MLast);
Street.val(_Street);
number.val(_number);
postalCode.val(_postalCode);
Mbirthdate.val(_Mbirthdate);
}
function save_data() {
$("#users tbody").append("<tr>" + "<td>" + (fname.find("option:selected").text() + ' ').concat(lname.find("option:selected").text()) + "</td>" + "<td>" + email.val() + "</td>" + "<td>" + password.val() + "</td>" + "<td><a href='' class='edit'>Edit</a></td>" + "<td><span class='delete'><a href=''>Delete</a></span></td>" + "</tr>");
dlg.dialog("close");
}
};
$(document).on('click', 'span.delete', function () {
$(this).closest('tr').find('td').fadeOut(1000,
function () {
// alert($(this).text());
$(this).parents('tr:first').remove();
});
return false;
});
$(document).on('click', 'td a.edit', function () {
new_dialog('Edit', $(this).parents('tr'));
return false;
});
$("#create-user").button().click(new_dialog);
});
</script>
</HEAD>
<BODY>
<div class="navbar">
<a href="mydatabase.php">Home</a>
<a href="member_table.php">Member</a>
<a href="book_table.php">Book</a>
<a href="borrows_table.php">Borrows</a>
</div>
<br><br>
<div class="navbar2">
<a href="insert.php">Insert</a>
<a href="update.php">Update</a>
<a href="delete.php">Delete</a>
</div>
<TABLE class="minimalistBlack">
<thead>
<tr>
<th> memberID </th>
<th> First Name </th>
<th> Last Name </th>
<th> Street </th>
<th> Number </th>
<th> Postal Code </th>
<th> Birthdate </th>
<th> Update </th>
</tr>
</thead>
<?php
$conn= mysqli_connect("localhost","root","","library");
mysqli_set_charset($conn, "utf8");
if ($conn -> connect_error){
die("Conenction failed:". $conn->connect_error);
}
$sql="SELECT memberID,MFirst,MLast,Street,number,postalCode,Mbirthdate FROM member";
$result = $conn->query($sql);
if ($result->num_rows>0){
while($row= $result->fetch_assoc()){
echo "<tr>";
echo "<td>".$row['memberID']."</td>";
echo "<td>".$row['MFirst']."</td>";
echo "<td>".$row['MLast']."</td>";
echo "<td>".$row['Street']."</td>";
echo "<td>".$row['number']."</td>";
echo "<td>".$row['postalCode']."</td>";
echo "<td>".$row['Mbirthdate']."</td>";
echo "<td><a class =\"edit\" href=\"\">Edit </a>
| <a href=\"deletefmtable.php?memberID=$row[memberID]\" onClick=\"return confirm('Are you sure you want to delete?')\">Delete</a></td>";
}
echo "</TABLE>";
}
else { echo "0 result"; }
$conn->close();
?>
</TABLE>
<div id="dialog-form" title="Create new user" style="display:none">
<p class="validateTips">
All form fields are required.</p>
<form>
<fieldset>
<label for="memberID">
Member ID </label>
<input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" />
<label for="MFirst">
First Name</label>
<input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" />
<label for="MLast">
Last Name </label>
<input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" />
<label for="Street">
Street </label>
<input type="text" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" />
<label for="number">
number </label>
<input type="text" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" />
<label for="postalCode">
Postal Code </label>
<input type="text" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" />
<label for="Mbirthdate">
Birthdate </label>
<input type="text" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" />
</fieldset>
</form>
</div>
</BODY>
</HTML>
코드의 목적은 테이블을 표시하고 측면에서 편집 및 삭제하는 것입니다. 삭제 버튼은 완벽하게 작동하지만 편집하려면 위에서 언급 한 변수를 PHP 파일로 전달해야합니다
- 답변 # 1
- 답변 # 2
전송하기 전에 PHP 측에서 JavaScript의 JSON.stringify (your_variable) 함수를 사용하고 json_decode ($_ GET [ ' 데이터 '])
your_variable은 객체 여야하며 코드처럼 감싸서는 안됩니다. 다음과 같이하십시오 :
그런 다음이 데이터 (콘텐츠 유형 : application/json으로 설정된 문자열 또는 헤더 세트)를 ajax post를 통해 php로 전달하십시오. SQL 쿼리에서.data = { var _memberID = $(row.children().get(1)).text(), _MFirst = $(row.children().get(2)).text(), _MLast = $(row.children().get(3)).text(), _Street = $(row.children().get(4)).text(), _number = $(row.children().get(5)).text(), _postalCode = $(row.children().get(6)).text(), _Mbirthdate = $(row.children().get(7)).text(); memberID.val(_memberID); MFirst.val(_MFirst); MLast.val(_MLast); Street.val(_Street); number.val(_number); postalCode.val(_postalCode); Mbirthdate.val(_Mbirthdate); }
관련 자료
- Javascript에서 객체 배열의 조합을 찾고 중복 제거하려면 어떻게해야합니까?
- reactjs - 자바 스크립트 객체 내부에 동적으로 객체 생성
- Javascript에서와 같이 C ++에 완전히 일반적인 객체가 있습니까?
- 자바 스크립트 - 조건이있는 배열에서 중복 객체 제거
- Razor (net Core)를 사용하여 여러 자바 스크립트 변수를 선언하는 방법
- 배열에서 JavaScript 객체를 비교할 때 문제
- 여러 자바 스크립트 변수 선언 및 시작
- Javascript에서 JSON 개체 변환 및 형식 지정
- dictionary - 자바 스크립트의 중첩 된 객체 배열에서 재귀 적으로 플랫 배열을 생성하려면 어떻게해야합니까?
- Javascript에서 배열이 비어있는 모든 json 객체를 선택하십시오!
- html - 숫자 만 변경하여 이러한 반복 가능한 Javascript 코드 세트를 어떻게 최적화합니까?
- 자바 스크립트에서 날짜를 키로 사용하여 개체를 집계하는 방법
- 객체 그룹 및 합계 항목의 Javascript 배열
- 청크 배열이 아닌 JavaScript의 객체 배열에서 배열 배열을 만드는 방법
- 두 가지 정렬 조건을 사용하여 JavaScript에서 객체 배열 정렬
- 자바 스크립트 함수에 여러 PHP 변수 보내기
- 객체의 새로운 배열 세트를 얻기 위해 객체의 자바 스크립트 배열 조작
- 중첩 객체 및 배열 Javascript를 반복하는 방법은 무엇입니까?
- 객체 배열에서 속성 값 찾기 (Javascript)
- arrays - Javascript는 객체 목록을 맵 맵으로 변환
관련 질문
- javascript : HTML 전화번호 유효성 검사
- javascript : 태그 내부의 모든 정보 검색: DOMNODE
- javascript : Safari에서 클릭 시 텍스트 선택 유지
- javascript : RGB 값으로 회색 음영 얻기
- javascript : 커서에 원을 붙이고 빠르게 움직이면 원이 잘리는 것처럼 보입니다.
- javascript : js 파일의 한 함수에서 변수를 가져와서 다른 js 파일의 다른 함수에 사용하려면 어떻게 해야 합니까?
- javascript : 각도 클릭 이벤트가
- PHP의 JavaScript findIndex()와 동일
- javascript : 캔버스에서 버튼을 정렬하고 스타일을 지정하는 방법은 무엇입니까?
- javascript : 제목 속성이 있는 tippy.js가 동적 콘텐츠에서 작동하지 않습니다.
좋아, 나는 도전을 좋아한다. 맨 위에서 시작 :
<올>PHP와 HTML을 가능한 많이 혼합하지 않으려 고합니다. JavaScript도 마찬가지입니다. 이상적으로는 모두 별도의 파일에 있지만 여기에서 분리합니다. 상단에서 작업을 수행하고 아래 코드 만 표시하도록 제한하십시오.
HTML로 표시하기 위해 항상 이스케이프 데이터를 사용하십시오.
htmlspecialchars()
사용 이를 위해1999 년이 아니므로 최신 문서 유형 선언을 사용해야합니다. 현대 HTML은 또한 소문자 요소를 의미하며
type
가 필요하지 않습니다.<script>
의 속성 요소.코드를 일관되게 들여 쓰고 간격을 두십시오. 문제를 디버깅하고 효율성을 찾는 데 도움이됩니다.
var
로 변수 선언 사용하기 전이나 처음 사용할 때이 대화 상자를 복제해서는 안됩니다. 클릭하면 새 값으로 채 웁니다.
여기서 실제 문제를 시작합니다. 첫째, 글로벌 변수에 너무 의존하고 있습니다. 예를 들어, 모든 변수의 값을
get_data()
에 설정합니다. 기능. 그러나 이것은 버튼을 누를 때가 아니라 대화 상자를 설정할 때 발생합니다. 이 사항은 양식을 제출할 때 발생해야합니다. (하지만 # 12 참조)우리는 그
get_data()
를 제거 할 수 있습니다 기능을 사용하고 기능을 편집 링크에 대한 클릭 핸들러 인 기능으로 이동합니다.data-
사용 속성은 PHP에서 클라이언트 측 스크립트로 데이터를 전달하는 좋은 방법입니다. 버튼에서 이러한 속성을 설정하고 서투른 DOM 탐색을 피하고 대신$.data()
를 사용하십시오. .언제든지 무언가가 변경되거나 생성되면 GET이 아닌 POST 동작을 사용하십시오. 이름에서 알 수 있듯이 GET은 리소스를 가져 오기위한 것이며 데이터를 변경하는 작업을 수행해서는 안됩니다.
close
대화 상자에서 완전히 제거하는 이유 속성? 재사용을 원하거나 새 창에 수정 팝업 결과가 표시되지 않을 것이라고 가정합니다.Ajax를 사용하지 않는 경우 양식 제출에 JS를 포함시킬 필요가 없습니다. 양식이 정상적으로 제출되도록하십시오.
코드와 일관성을 유지하십시오. 다른 버튼이 모두 분리 된 경우 삭제 버튼에 HTML에 이벤트 핸들러가있는 이유는 무엇인가요?
당신은
<tr>
를 닫지 않았습니다 요소와 당신은 당신의<table>
를 마감 요소를 두 번.모든 양식 요소의 이름과 ID가 잘못되었습니다.
이것은 트릭을 수행해야합니다 :
당신이 할 일은
edituple.php
를 허용하는 것입니다$_POST
를보고$_GET
대신 . 그리고 데이터베이스 업데이트를 위해 준비된 명령문을 사용하는 것을 잊지 마십시오! PDO 또는 더 높은 수준의 데이터베이스 API를 사용하는 것이 좋습니다. mysqli는 매우 장황하며 실제로 데이터베이스 API를 빌드하도록 설계되었으며 직접 사용하지는 않는다.