davelearning Posted January 11, 2011 Share Posted January 11, 2011 Hi all, This is more of a general advice request than an actual help topic. Basically I have a page which is for tagging images, that another developer has written: <?php include('../includes/config.php'); if(isset($_GET['del'])){ mysql_query("delete from tags where id = $_GET[del]"); } if(!isset($_GET['pic'])){ $pic = 1; } else { $pic = addslashes($_GET[pic]); } if($_POST){ if($_POST[description]!=""){ foreach($_POST as $id => $val){ $$id = addslashes($val); } mysql_query(" insert into tags (pictureid,top,`left`,width,height,description) values ($pic,$top,$left,$width,$height,'$description')") or die(mysql_error()); header("location:demo.php"); } } ?> <html> <head> <script src="./js/jquery.js" language="JavaScript" type="text/javascript"></script> <script src="./js/jquery-ui.js" language="JavaScript" type="text/javascript"></script> <link type="text/css" href="./css/jquery-ui.css" rel="stylesheet" /> <script> function updateForm(){ $("#width").val($("#drag").attr("offsetWidth")); $("#height").val($("#drag").attr("offsetHeight")); $("#top").val($("#drag").attr("offsetTop")); $("#left").val($("#drag").attr("offsetLeft")); } $(document).ready(function(){ updateForm(); $("#drag").resizable({ stop: function() { updateForm(); } }); $("#drag").draggable({ containment: 'parent', stop: function() { updateForm(); } }); $(".tag").hover( function () { $(this).addClass("tagOn"); }, function () { $(this).removeClass("tagOn"); } ); }); </script> <style> .tagOn{ border:1px solid black; } #taggingArea{ position:relative; width:auto; float:left; } #formArea{ width:50%; float:left; } #drag{ position:absolute; top:0px; width:100px; height:100px; border:2px solid black; background:url('blank.gif'); } </style> </head> <body> <h1>Testing image tagging</h1> <div id="taggingArea"> <img src="<?php echo $pic;?>.jpg" /> <?php if($_GET['mode']=="edit"){ ?><div id="drag" class="ui-widget-content"></div><?php } else { $getTags = mysql_query("select * from tags where pictureid = $pic"); if(mysql_num_rows($getTags)>0){ while($resTags = mysql_fetch_array($getTags)){ ?> <div class=tag style="position:absolute;width:<?php echo $resTags['width'];?>px;height:<?php echo $resTags['height'];?>px;top:<?php echo $resTags['top'];?>;left:<?php echo $resTags['left'];?>;"> <?php echo $resTags['description'];?> </div> <?php } } } ?> </div> <?php if($_GET['mode']=="edit"){ ?> <div id="formArea"> <form method=post> <input type=hidden name=pic value="<?php echo $pic;?>"> <input type=hidden name=width id=width> <input type=hidden name=height id=height> <input type=hidden name=top id=top> <input type=hidden name=left id=left> Description : <input type=submit value=save> </form> <?php $getTags = mysql_query("select * from tags where pictureid = $pic"); if(mysql_num_rows($getTags)>0){ while($resTags = mysql_fetch_array($getTags)){ echo "Tag #$resTags[id] $resTags[description] <a href=\"demo.php?del=$resTags[id]\">Delete</a><br />"; } } ?> <a href="demo.php">Go to view mode</a> </div> <?php } else { ?> <div id="formArea"> <a href="demo.php?mode=edit">Go to edit mode</a> </div> <?php } ?> </body> </html> Basically what I hope to achieve is for all this to work, as the user would see it, on one page. Main main point is, how feasible is it to do something like this, and could anyone recommend any good books to get me started in ajax? I have a basic javascript knowledge, so looking at a few scripts I can work out roughly whats going on, but I am far more beginner than anything else! Quote Link to comment https://forums.phpfreaks.com/topic/224039-ajax-advice/ Share on other sites More sharing options...
trq Posted January 11, 2011 Share Posted January 11, 2011 I have a basic javascript knowledge, so looking at a few scripts I can work out roughly whats going on, but I am far more beginner than anything else! I would use a framework. It makes things allot easier. jQuery is my preferred, http://jquery.com/ Quote Link to comment https://forums.phpfreaks.com/topic/224039-ajax-advice/#findComment-1157781 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.