I am trying to load an HTML form from JSON returned from a PHP script.
The code I have goes into the plugin's code but nothing ever happens.
The data parameter has the correct data.
It doesn't go into either of the functions so I don't know what I'm doing wrong.
I know this is a long post but I really appreciate your taking a look.
script calling loadJSON:
- $(document).ready(
function() {
$('#show_edit_div').click(function(){
var url="edit_task.php?id="+this.attributes[0].nodeValue;
try{
$.getJSON(url, function(data, textStatus) {
$('#editTaskInfo').loadJSON(data);
});
}catch(err){
alert(err.description);
}
var div = document.getElementById('edit_div');
div.style.visibility="visible";
return true;
})
});
PHP code to return JSON:
- <?php
include("include/config.php");
if(isset($_GET["id"])) {
$sqltask = "SELECT `task_title`, `task_desc`,`task_instr`,`task_tags`,
`task_price`,`category_id`,`task_days`,`task_image`,
`task_status`
FROM task WHERE task_id = '".$_GET["id"]."'";
$result = mysql_query($sqltask) or die("SQL error occured: {$sqltask}<br />".mysql_error()."<br />".__FILE__.":".__LINE__);
$resArr = mysql_fetch_assoc($result);
echo json_encode( $resArr );
} // if(isset($_GET["id"]))
?>
form code:
- <div id="edit_div" style="visibility:hidden;">
<table width="80%" align="center">
<tr>
<td bgcolor="#FFFFFF">
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="4" style="border:solid 1px #FF8043;">
<form name="editTaskInfo" action="#" method="post" enctype="multipart/form-data">
<tr>
<td colspan="4" height="7"></td>
</tr>
<tr>
<td colspan="4" align="left" class="smlt">
<span style="color:#ff6600; font-size:18px; font-weight:bold;"> Edit Task Information</span>
</td>
</tr>
<tr>
<td colspan="4" align="left" width="3%" class="smlt"> </td>
</tr>
<tr>
<td align="left" width="3%" class="smlt"> </td>
<td width="35%">
<span style="color:#0099FF; font-size:12px; font-weight:bold;">Task Title: </span>
</td>
<td align="left" width="59%" class="smlt">
<input type="text" name="task_title" value="" size="42" />
</td>
<td align="left" width="3%" class="smlt"> </td>
</tr>
<tr>
<td width="3%" height="154" align="left" class="smlt"> </td>
<td width="35%" ><span style="color:#0099FF; font-size:12px; font-weight:bold;">Task Description :</span> </td>
<td align="left" width="59%" class="smlt">
<textarea cols="35" rows="10" name="task_desc" class="smlt" style="font:Arial, Helvetica, sans-serif; font-size:11px;"></textarea>
</td>
<td align="left" width="3%" class="smlt"> </td>
</tr>
<tr>
<td width="3%" height="154" align="left" class="smlt"> </td>
<td width="35%" ><span style="color:#0099FF; font-size:12px; font-weight:bold;">Task Instructions:</span> </td>
<td align="left" width="59%" class="smlt">
<textarea cols="35" rows="10" name="task_instr" class="smlt" style="font:Arial, Helvetica, sans-serif; font-size:11px;"></textarea>
</td>
<td align="left" width="3%" class="smlt"> </td>
</tr>
<tr>
<td align="left" width="3%" class="smlt"> </td>
<td width="35%" ><span style="color:#0099FF; font-size:12px; font-weight:bold;">Tags :</span> </td>
<td align="left" width="59%" class="smlt">
<textarea cols="35" rows="10" name="task_tags" class="smlt" style="font:Arial, Helvetica, sans-serif; font-size:11px;"></textarea>
</td>
<td align="left" width="3%" class="smlt"> </td>
</tr>
<tr>
<td align="left" width="3%" class="smlt"> </td>
<td width="35%"><span style="color:#0099FF; font-size:12px; font-weight:bold;">Task Price (in USD) :</span> </td>
<td align="left" width="59%" class="smlt">
<select name="task_price">
<?php
$sqlprice = "SELECT comm_trans FROM commission
ORDER BY comm_trans ASC";
$result = mysql_query($sqlprice) or die("SQL error occured: {$sqlprice}<br />".mysql_error()."<br />".__FILE__.":".__LINE__);
while($record = mysql_fetch_array($result)) {
?>
<option value="<?php echo $record['comm_trans'] ?>"><?php echo $record['comm_trans']; ?></option>
<?php
} // while($record=mysql_fetch_array($result))
?>
</select>
</td>
<td align="left" width="3%" class="smlt"> </td>
</tr>
<tr>
<td align="left" width="3%" class="smlt"> </td>
<td width="35%"><span style="color:#0099FF; font-size:12px; font-weight:bold;">Category :</span></td>
<td align="left" width="59%" class="smlt">
<select name="task_category">
<?php
$sqlcategory = "SELECT * FROM category
ORDER BY category_name ASC";
$result = mysql_query($sqlcategory) or die("SQL error occured: {$sqlcategory}<br />".mysql_error()."<br />".__FILE__.":".__LINE__);
while($record = mysql_fetch_array($result)) {
?>
<option value="<?php echo $record['category_id']; ?>"><?php echo $record['category_name']; ?></option>
<?php
} // while($record=mysql_fetch_array($result))
?>
</select>
</td>
<td align="left" width="3%" class="smlt"> </td>
</tr>
<tr>
<td align="left" width="3%" class="smlt"> </td>
<td width="35%"> <span style="color:#0099FF; font-size:12px; font-weight:bold;">Days :</span> </td>
<td align="left" width="59%" class="smlt">
<input type="text" name="task_days" value="" size="20" readonly="readonly" />
</td>
<td align="left" width="3%" class="smlt"> </td>
</tr>
<tr>
<td align="left" width="3%" class="smlt"> </td>
<td width="35%"><span style="color:#0099FF; font-size:12px; font-weight:bold;">Task Image:</span> </td>
<td align="left" width="59%" class="smlt">
<input type="file" name="edittask" size="30" onchange="example_ajax_request(document.editTaskInfo.edittask.value,'editimage')" />
</td>
<td align="left" width="3%" class="smlt"> </td>
</tr>
<tr>
<td align="left" width="3%" class="smlt"> </td>
<td width="35%"><span style="color:#0099FF; font-size:12px; font-weight:bold;">Status :</span> </td>
<td align="left" width="59%" class="smlt">
<select name="stat" style="width:128px;">
<option value="0">Blocked </option>
<option value="1">Unblocked</option>
</select>
</td>
<td align="left" width="3%" class="smlt"> </td>
</tr>
<tr>
<td colspan="4" align="left" width="3%" class="smlt"> </td>
</tr>
<tr>
<td align="left" class="smlt"></td>
<td align="left" class="smlt"></td>
<td align="center" class="smlt">
<input type="image" src="images/Update.png" name="btnSubmit" value="Update" onclick="checkForm(document.editTaskInfo.edittask.value);"/>
<input type="image" src="images/Cancel.png" value="cancel" onclick="hide_edit_div()" />
<input type="hidden" value="" name="taskID" />
</td>
<td align="center" class="smlt"> </td>
</tr>
<tr>
<td colspan="4" align="left" width="3%" class="smlt"> </td>
</tr>
</form>
</table>
</td>
</tr>
<tr>
<td bgcolor="#FFFFFF"> </td>
</tr>
</table>
</div>