javascript - 从 ajax 生成的 php 文件中调用 jquery 对话框

标签 javascript php jquery ajax

// functions for dialog form....
$(function() {
  var dialog, form, allFields

  // add new dialog
  dialog = $("#frm_Add").dialog({
    autoOpen: false,
    height: 600,
    width: 800,
    modal: true,
    buttons: {
      "Save": addNewIMTE,
      Cancel: function() {
        dialog.dialog("close");
      }

    },
    close: function() {
      //form[ 0 ].reset();
      //	allFields.removeClass( "ui-state-error" );
    }
  });

  form = dialog.find("form").on("submit", function(event) {
    event.preventDefault();
  });

  $("#AddNewItem").button().on("click", function() {
    dialog.dialog("open");
  });
});

// end add new dialog

$(function() {

  // add edit dialog
  var dialogEdit, formEdit, allFieldsEdit
  dialogEdit = $("#dialog-EditForm").dialog({
    autoOpen: false,
    height: 400,
    width: 600,
    modal: true,
    buttons: {
      "Save": addNewIMTE,
      Cancel: function() {
        dialogEdit.dialog("close");
      }
    },
    close: function() {
      //formEdit[ 0 ].reset();
      //allFieldsEdit.removeClass( "ui-state-error" );
    }
  });

  formEdit = dialogEdit.find("form").on("submit", function(event) {
    event.preventDefault();
  });

  //	$(document).on("click","a#editME",function(){
  //	$("a#editME").click(function(){ 
  //      dialogEdit.dialog( "open" );
  //	}); 

  $(document).on("click", "#editME", function() {
    dialogEdit.dialog("open");
  });




});


function addNewIMTE() {
  var valid = true;
  allFields.removeClass("ui-state-error");
  //valid = valid && checkLength( name, "username", 3, 16 );
  //valid = valid && checkLength( email, "email", 6, 80 );
  //valid = valid && checkLength( password, "password", 5, 16 );
  //valid = valid && checkRegexp( name, /^[a-z]([0-9a-z_\s])+$/i, "Username may consist of a-z, //0-9, underscores, spaces and must begin with a letter." );
  //valid = valid && checkRegexp( email, emailRegex, "eg. ui@jquery.com" );
  if (valid) {
    //call save function - saveIMTE()
    //alert('you pressed me');
    saveNewIMTEData();
    dialog.dialog("close");
  }
  return valid;
}
<?php session_start();?>

<!DOCTYPE>

<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  <title>DJ Inspection</title>

  <!--<link rel="stylesheet" type="text/css" href="css/pos.css">
		<link rel="stylesheet" type="text/css" href="./css/print.css" media="print" />
		-->
  <link rel="stylesheet" href="./scripts/jquery-ui-themes-1.11.2/themes/smoothness/jquery-ui.css">


  <link rel="stylesheet" href="./css/css01.css" type="text/css" />

  <script src=./scripts/jquery/jquery-1.11.1.js></script>
  <script src=./scripts/jquery/1.11.2/jquery-ui.js></script>
  <script src=./scripts/dialogFrms.js></script>

  <script src="./scripts/rpt001.js"></script>
  <script src="./scripts/jquery.printPage.js"></script>

  <script src="./scripts/jquery.printPage.js" type="text/javascript"></script>

  <script>
    $(document).ready(function() {
      getStockList("1", "");

    });


    $(function() {
      $("#calDate").datepicker();
    });

    $(function() {
      $("#calDue").datepicker();
    });
  </script>


</head>

<?php date_default_timezone_set( 'Asia/Kuala_Lumpur'); 
require_once( "common.php"); 
$connection=o penMaintData(); 
$sqlCat="select ID,Description from imtecat" ; 
$rsCat=$ connection->query($sqlCat); 
$rowsCat = $rsCat->num_rows; 
$sqlLocation = "select id,description from location"; 
$rsLocation = $connection->query($sqlLocation); 
$rowsLocation = $rsLocation->num_rows; 
$sqlPIC = "select ID,Name from personnel"; 
$rsPIC = $connection->query($sqlPIC);
$rowsPIC = $rsPIC->num_rows; 
$sqlVendor = "select id,CalVendor from calvendor"; $rsVendor = $connection->query($sqlVendor); $rowsVendor = $rsVendor->num_rows; $sqlPeriod = "select ID,Period from inspperiod"; $rsPeriod = $connection->query($sqlPeriod);
$rowsPeriod = $rsPeriod->num_rows; mysqli_close($connection); ?>

<body>


  <img src="/djapps/img/dj logo red.png" alt="djlogo">

  <div id='breadcrumb'>
  </div>

  <div id=stklistheader>

    <table border=0 class='hello' width=0%>
      <tr>

        <td>
          <a href="javascript:" onclick=" getStockList('','');">
            <div id="filterButton"></div>
          </a>
        </td>
        <td>

          <!--<a class="btnPrint" href='/DJApps/print01.html'>Print!</a>
						-->
        </td>

        <td>
          <button id="AddNewItem">Create New Item</button>

          <a href="#" id="editME">Edit</a">
            <div id="FilterType"></div>
              </td></tr>
            </table>
		
          <table>
            <tr>	  
              <td>
                Search
              </td>
              <td>
                <input name="cSearchThis" id='cSearchThis' type="text" size="50" maxlength="80"/>
                  </td>
                </tr>
             </table>
		</div>	 
		
		<div id=stklistheader1>
		
		</div>	 
		
		<div id="placeStkList"></div>
			
	</div>
	
</table>

</div>

<div id="placeRightChildInfo">
	fdfdd
</div>

<?php include 'dialogAddNew.php'?>
<?php include 'dialogEdit.php'?>
		
	
</body>

<script>
	
	$(document).ready(function() {
		$(".btnPrint").printPage();
	});
	
	document.getElementById("filterButton").innerHTML = "Alarm Scan"; 
	
	$( "#cSearchThis" ).keyup(function( event ) {
		getStockList("1","");
	});
	
	

     $(".myclass tr").click(function(){
       window.location = "example.html";
     });
	
</script>



</html>


  
    
<!-- this is ajaxListStk01- called by ajax-->
  
    <?php
	date_default_timezone_set('Asia/Kuala_Lumpur');
	require_once "/JSON.php";
	
		
	$param0    = trim(strip_tags((isset($_GET['str1']) && $_GET['str1'] != '') ? $_GET['str1'] : ''));
	$param1    = trim(strip_tags((isset($_GET['sid']) && $_GET['sid'] != '') ? $_GET['sid'] : ''));
	
	$jsonArray = json_decode($param0,'true');
	$noItems   = sizeof($jsonArray["sStkList"])-1;    
	$QtyItem   = $noItems+1;
	
	switch(json_last_error())
	{
		case JSON_ERROR_DEPTH:
		//	echo ' - Maximum stack depth exceeded';
		break;
		case JSON_ERROR_CTRL_CHAR:
		//	echo ' - Unexpected control character found';
		break;
		case JSON_ERROR_SYNTAX:
		//	echo ' - Syntax error, malformed JSON';
		break;
		case JSON_ERROR_NONE:
		//    echo ' - No errors';
		break;
	}
	
	require_once("common.php");
	
	$whatElse = $jsonArray["sStkList"][0]["flag"];
	$SearchThis = $jsonArray["sStkList"][0]["descrip"];
	$SortBy = $jsonArray["sStkList"][0]["sortBy"];
	
	//$orderStr = $SortBy;
	
	echo "Sorted By: ".$SortBy;
	
	$connection = openMaintData();
	
	//$now = date("Y-m-d");
	$now = time(); // or your date as well
	
	$certPath = "/certRep/";
	$imgPath = "/images/";
	$iconPath = "/icons/";
	
	if($whatElse == "A"){
		$activeStr  = " DATEDIFF(imtemaster.CalDue, NOW()) <= 30 and ";
		$orderStr = " imtemaster.CalDue ASC";
		$whatElse = "FILTERED ";
	}else{
		$activeStr  = "";
		$orderStr = "imtemaster.Description ASC";
		$whatElse = "ALL";
	}
	
	if($SortBy <> ""){
		$activeStr  = "";
		$orderStr = $SortBy;
		$whatElse = "SORTED";
	}
	
	echo "** ".$SearchThis.' - '.$whatElse.' - '.$activeStr;
	
	
	
	$sqlStr = "SELECT
	imtemaster.id,
	imtemaster.catID,
	imtemaster.description,
	imtemaster.serialno,
	imtemaster.Brand,
	imtemaster.Model,
	imtemaster.Specs,
	imtemaster.CalDate,
	imtemaster.CalDue,
	imtemaster.CalPeriod,
	imtemaster.CalBy,
	imtemaster.CertRef,
	imtemaster.Location,
	imtemaster.PIC,
	imtemaster.Status,
	imtemaster.Remarks,
	imtecat.Description,
	inspperiod.Period,
	calvendor.CalVendor,
	personnel.Name,
	status.description,
	Location.description,
	imtemaster.image
	FROM imtemaster 
	INNER JOIN imtecat ON imtecat.ID = imtemaster.catID 
	LEFT JOIN inspperiod ON inspperiod.ID = imtemaster.CalPeriod
	LEFT JOIN calvendor ON calvendor.id = imtemaster.CalBy
	LEFT JOIN status ON status.id = imtemaster.Status
	LEFT JOIN Location ON Location.id = imtemaster.Location
	LEFT JOIN personnel ON personnel.ID = imtemaster.PIC 
	where ".$activeStr."
	(imtemaster.description LIKE '%".$SearchThis."%' || imtemaster.Brand LIKE '%".$SearchThis."%'
	|| imtemaster.serialno LIKE '%".$SearchThis."%'
	|| imtemaster.ID LIKE '%".$SearchThis."%'
	|| imtemaster.Specs LIKE '%".$SearchThis."%'
	|| imtemaster.Model LIKE '%".$SearchThis."%'
	|| imtemaster.Brand LIKE '%".$SearchThis."%'
	|| imtemaster.CertRef LIKE '%".$SearchThis."%'
	|| personnel.Name LIKE '%".$SearchThis."%'
	|| imtecat.Description LIKE '%".$SearchThis."%'
	|| Location.Description LIKE '%".$SearchThis."%'
	|| calvendor.CalVendor LIKE '%".$SearchThis."%'
	|| status.description LIKE '%".$SearchThis."%'
	|| imtemaster.Remarks LIKE '%".$SearchThis."%'
	|| imtemaster.Remarks LIKE '%".$SearchThis."%')
	order by ".$orderStr;	
	
	// and
	//(imtemaster.Status != 2)
	//	echo $sqlStr;
	
	$rsInv = $connection->query($sqlStr);	
	
	$rowsInv = $rsInv->num_rows;
	
	echo "No of IMTE found: ".$rowsInv;
	
	echo '<a href="#" id="itemEdit">Edit</a">';
	
	
	if ($rowsInv > 0) {
		
		echo '<div class="scrollableContainer">
		<div class="scrollingArea">
		
		<table class="imte fixHeader">
		<thead>
		
		<tr id="myclass" bgcolor="#CC99FF">
		
		<th><div class="ID">
		<a href="#" onClick="getStockList(\'1\',\' imtemaster.id ASC\');">ID</a></div></th>
		
		
		<th><div class="Status">
		<a href="#" onClick="getStockList(\'1\',\' status.description ASC\');">Status</a></div></th>
		<th><div class="Cat">
		<a href="#" onClick="getStockList(\'1\',\' imtecat.Description ASC\');">Type</a></div></th>
		
		<th><div class="Descrip">
		<a href="#" onClick="getStockList(\'1\',\' imtemaster.Description ASC\');">Description</a></div></th>
		
		<th><div class="SNo">
		<a href="#" onClick="getStockList(\'1\',\' imtemaster.serialno\');">Serial No</a></div></th>
		
		<th><div class="Per">
		<a href="#" onClick="getStockList(\'1\',\' inspperiod.Period ASC\');">Period</a></div></th>
		
		<th><div class="CalOn">
	    <a href="#" onClick="getStockList(\'1\',\' imtemaster.CalDate ASC\');">Cal On</a></div></th>
	
		<th><div class="CalDue">
		<a href="#" onClick="getStockList(\'1\',\' imtemaster.CalDue ASC\');">Due</a></div></th>
		
		<th><div class="Days2Exp">Exp (Days)</div></th>
		
		<th><div class="Loc">
		<a href="#" onClick="getStockList(\'1\',\' Location.description ASC\');">Loc</a></div></th>
	
		<th><div class="CalBy">
		<a href="#" onClick="getStockList(\'1\',\' calvendor.CalVendor ASC\');">Cal By</a></div></th>
			
		<th><div class="Remarks">Remarks</div></th>
		<th><div class="Edit">Action</div></th>
		<th><div class="Image">Img</div></th>
		<th><div class="PDF">Cert</div></th>
		<th><div class="Excel">Excel</div></th>
		</tr>
		</thead>
		
		<tbody>';
		
		$i = 0;

		while ($rowsInv=mysqli_fetch_row($rsInv))
		{
			$id               = $rowsInv[0];
			$catID            = $rowsInv[1];
			$description      = $rowsInv[2];
			$serialno         = $rowsInv[3];
			$Brand            = $rowsInv[4];
			$Model            = $rowsInv[5];
			$Specs            = $rowsInv[6];
			$CalDate          = $rowsInv[7];
			$CalDue           = $rowsInv[8];
			$CalPeriod        = $rowsInv[9];
			$CalByID           = $rowsInv[10];
			$CertRef          = $rowsInv[11];
			$Location         = $rowsInv[12];
			$PIC              = $rowsInv[13];
			$Remarks          = $rowsInv[15];
			$CatDescp         = $rowsInv[16];
			$Period           = $rowsInv[17];
			$CalBy            = $rowsInv[18];
			$PIC              = $rowsInv[19];
			$Status           = $rowsInv[20];
			$WhereIsIt        = $rowsInv[21];
			$StatusID        = $rowsInv[14];
			$image        = $rowsInv[22];
			
			$i = $i + 1;
			
			if($i % 2 ==0)
			
			{
				$bgcolor='#FFFFFF';
				}else{
				$bgcolor='#E9E9E9';
			}
			
			//	$offset = $Period;	
			//	$now = time();
			//	$days2expiry = floor((strtotime(date('Y-m-d', 
			//	strtotime("+$offset months-1 day", //strtotime($CalDate))))-$now)/(60*60*24));

			$datediff =strtotime($CalDue)-$now;
			$days2expiry = floor($datediff/(60*60*24));
			
			if ($days2expiry <= 30 ){
				$bgcolor='FFAA7F';
			};
			
			if ($days2expiry > 0 and $days2expiry <= 30  ) {
				$bgcolor='FFCC99';
			};
						
			if ($days2expiry <= 0 ){
				$bgcolor= 'red';
			};
			
			if ($Status == 7 ){
				$bgcolor='FFAA7F';
			}
			
			//echo '<td ><div>'.$i.'</div></td>';			
			//	echo '<td ><div>'.$CatDescp.'-'.trim($description).'-'.trim($Brand).'-'.trim($Model).'-'.trim($Specs).'</div></td>';
			//echo '<td><div>'.$CalDate.'</div></td>';
			//echo '<td><div>'.$CalDue.'</div></td>';
			//echo '<td><div>'.$Period.'</div></td>';
			//echo '<td><div>'.$CalBy.'</div></td>';
			//echo '<td><div>'.$CertRef.'</div></td>';
			//echo '<td><div>'.$PIC.'</div></td>';
			//echo '<td><div>'.$WhereIsIt.'</div></td>';
			
			//echo '<td><div><a id="create-newIMTE">Edit</a></div></td>';
			
			echo '<tr color='.$bgcolor.'>';
			
			echo '<td ><div class="ID">
			<a id="itemEdit" href="#">'.$id.'</a>
			</div></td>';
			
			echo '<td ><div class="Status">'.$Status.'('.trim($StatusID).')'.'</div></td>';
			echo '<td ><div  class="Cat">'.$CatDescp.'('.trim($catID).')'.'</div></td>';
			echo '<td ><div  class="Descrip">'.trim($description).'-'.trim($Brand).'-'.trim($Model).'-'.trim($Specs).'</div></td>';
			echo '<td><div class="SNo">'.$serialno.'</div></td>';
			echo '<td><div class="Per">'.$Period.'</div></td>';
			echo '<td><div class="CalOn">'.$CalDate.'</div></td>';
			echo '<td><div class="CalDue">'.$CalDue.'</div></td>';
			echo '<td ><div class="Days2Exp">'.(float)$days2expiry.'</div></td>';
			echo '<td><div   class="Loc">'.$WhereIsIt.'('.trim($Location).')'.'</div></td>';
			echo '<td><div   class="CalBy">'.$CalBy.'-('.$CalByID.')'.'</div></td>';
			echo '<td><div  class="Remarks">'.$Remarks.'</div></td>';
			echo '<td><div  class="Edit"><a onClick="yourFunction(); return false;" href="fallback.html">One Way</a>';
			
			
			//echo '<td><div class="Image"><a href="'.$imgPath.'/'.$id.'.png" target="_blank">Pic</a></div></td>';
			/*
			echo '
			<td>
			<div class="Image">
			<img src="data:image/png;base64,'.base64_encode($image) .'" />
			</div>
			</td>';
			*/

			if ( !empty( $image ) ) {
			echo '<td><div  class="Img"><a href="'.$imgPath.'/'.$id.'.png" target="_blank"><img src="'.$imgPath.'/'.$id.'.png" alt="Pic" title="Click to view" border="0" width="20px" height="20px" hspace="10px" /></a></div></td></a>';
			
			}else{
			
			echo '<td><div  class="Img"><a href="'.$imgPath.'/na.png" target="_blank"><img src="'.$imgPath.'/na.png" alt="Pic" title="Click to view" border="0" width="20px" height="20px" hspace="10px" /></a></div></td></a>';
			
			}
			
			echo '<td><div  class="PDF"><a href="'.$certPath.'/'.$id.'.pdf" target="_blank">
			<img src="'.$iconPath.'pdf.png" alt="PDF" title="Click to view" border="0" width="20px" height="20px" hspace="10px" />cert</a></div></td>';
			echo '<td><div  class="Excel"><a href="'.$certPath.'/'.$id.'.xlsx">IHCert</a></div></td>';
			
			//<a href="#" id="create-newIMTE">Edit</a></div></td>';
			//<a href='javascript:myFunction()'> Click Me! <a/>
		};
		
	}
	
	echo '<div id="register"></div>';
	
	echo '</tbody></table>';
	
		
	
	echo '</div>';
	echo '</div>';
	
	
	
	
?> 

      

我搜索了类似的问题,但无法找到问题的解决方案。

我正在尝试使用通过ajax生成的超链接中的jquery对话框。 javascript 全部从调用 ajax 的第一个页面运行。 当我点击超链接时,没有任何反应,但当我将相同的超链接放在第一页时,它就起作用了。

这是由ajax生成的: '.$id。'

程序初始化时运行 JavaScript:

$("a#editME").click(function(){ 
dialogEdit.dialog( "open" );

有人可以帮忙吗?

谢谢

ajax generated table

最佳答案

你应该试试这个

$(document).on("click","a#editME",function(){
    dialogEdit.dialog( "open" );
})

关于javascript - 从 ajax 生成的 php 文件中调用 jquery 对话框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33095508/

相关文章:

javascript - 使用Ajax进行页面更改,仍然保存输入的数据

jquery - 显示一个剪裁的 div

javascript - 使用 '_.some' 在每个项目上调用函数的简写

javascript - HTML 5 模板中使用的 PHP 联系表单,但不发送电子邮件

php - MySQL 查询未执行 : "warning: mysql_fetch_assoc() expects parameter 1 to be resource"

php - Opencart:修改电子邮件布局

javascript - 删除使用 jquery 创建的元素

jquery - 当其他 div 动画完成时开始动画 div

javascript - 优雅地同时计算数字数组的最小值和最大值

javascript - rails : how to pass data from Ruby to Javascript