ajax-php

Heru · Nov 4, 2011
Permisi mas saya ada beberapa pertanyaan mengenai ajax-php.
Saya ingin membuat aplikasi web yg bs menyimpan data plus menyimpan dan mengupload foto.Misal nama,alamat, dan foto. Saya sudah mencoba membuat web tersebut melalui tutorial yang mas berikan.Tetapi masalahnya saya bs menyimpan data nama,alamat,dan gambar, tetapi sy tdk bisa mengupload gambar tersebut.Kodingnya sebagai berikut:
// JavaScript Document
function getXMLHttpRequest(){
	if(window.ActiveXObject){
		return new ActiveXObject("Microsoft.XMLHTTP");
	}else if(window.XMLHttpRequest){
		return new XMLHttpRequest();	
	}else alert("Status : Can not create XMLHttpRequest Object");
}
var xmlhttp=getXMLHttpRequest();
function sendRequest(pageURL,ElementID){
	var obj=document.getElementById(ElementID);
	obj.innerHTML='Loading.... please wait.';
	if(xmlhttp.readyState==4 || xmlhttp.readyState==0){
		xmlhttp.open('GET',pageURL,true);
		xmlhttp.onreadystatechange=function(){
			if(xmlhttp.readyState==4 && xmlhttp.status==200){
				obj.innerHTML=xmlhttp.responseText;
			}
		}
		xmlhttp.send(null);
	}
}
var xmlhttp=getXMLHttpRequest();
//function to send data
function sendData(handlePage,ElementID){
	var nama=document.getElementById('nama').value;
	var alamat=document.getElementById('alamat').value;
	var photo=document.getElementById('photo').value;

	var filterEmail=/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
	var filterPhone=/^[0-9]+$/;
	//validate user input
	if(nama==""){
		alert("Input Nama First!");
	}else if(alamat==""){
		alert("Input Alamat first!");
	}else if(photo==""){
		alert("Input Photo first!");
	}else{
		if(xmlhttp.readyState==4 || xmlhttp.readyState==0){
			var obj=document.getElementById(ElementID);
			var form=obj.innerHTML;
			obj.innerHTML='Saving data, please wait..';
			xmlhttp.open('POST',handlePage,true);
			xmlhttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
			xmlhttp.onreadystatechange=function(){
				if(xmlhttp.readyState==4){
					if(xmlhttp.status==200){
						obj.innerHTML=xmlhttp.responseText+'<br>'+form;
						//document.getElementById('form1').submit();
						obj.innerHTML=form1.submit();
					}else{
						alert('Error : '+xmlhttp.statusText);
					}
				}
			}
			var param='nama='+nama;
			param+='&alamat='+alamat;
			param+='&photo='+photo;

			param+='&action=save';
			xmlhttp.send(param);
		}
	}
}

Kemudian phpnya.
///insert.php
<html>
  <head>
    <title>
      Save Data & Upload dengan AJAX
    </title>
    <script type="text/javascript" src="ajaxs.js"></script>
  </head>
  <body>
  <h1>Save Data dan Upload Gambar AJAX</h1>
  <iframe name="upload" id="upload" style="display:none;"></iframe>
  <div id="status"></div>
  <form name="form1" id="form1" target="upload" action="upload-gambar.php" enctype="multipart/form-data" method="post">
    <p>Nama: <input type="text" name="nama" id="nama" /></p>
    <p>Alamat: <textarea name="alamat" id="alamat"></textarea></p>
    <p>Photo: <input type="file" name="photo" id="photo" /></p>
    <p><input type="button" name="save" value="Save" onclick="sendData('save-data.php','content'); return false;" /></p>
  </form>
  </body>
</html>

////
insert.php
<?php
	$conn=mysql_connect("localhost","","");  
	mysql_select_db('coba'); 
	
	if($_SERVER['REQUEST_METHOD']=='POST') 
	 {
		
		 $nama=$_POST['nama'];
		 $alamat=$_POST['alamat'];
		 $photo=$_POST['photo'];
		 //saving data
		
		 $query="INSERT INTO data (Nama,Alamat,photo) VALUES ('$nama','$alamat','$photo')";
		 $hasil=@mysql_query($query);
		if($hasil)
		{
	 	echo '<font color="green">DATA HAS BEEN SAVED</font>';
		}
		else 
		{
	 	echo '<font color="red">Error, CAN NOT SAVE DATA</font>';
	 	}
		
	}
	else
	{
	}
?>
////upload.php
<?php

 $fileName = $_FILES['photo']['name'];  
   $fileSize = $_FILES['photo']['size'];  
   $fileError = $_FILES['photo']['error'];  
   $success = false;  
   echo $fileName;
   if($fileSize > 0 || $fileError == 0){  
     $move = move_uploaded_file($_FILES['photo']['tmp_name'], 'images/'.$fileName); //atau ke directory yang dinginkan  
     if($move){ 
    $success = true;  
	 //  $query = "insert into data set photo='$fileName'";
	//$query= "update data set photo='".$filename."' where Nama='".$nama."'";  
   // mysql_query($query) or die("Upload Gambar Gagal: ".mysql_error());  
    //echo "Gambar telah disimpan";  
    
     }  
   }  
  
//echo '<script type="text/javascript">';  
//  if($success){  
//    echo "parent.displayPicture('images/$fileName');";  
//  }else{  
//    echo "alert('Upload gagal $fileError');";  
//  }  
//echo '</script>';  
?>

Kemudian saya ingin membuat sebuah menu ajax-php dimana didalam menu ada menu lg yg menggunakan ajax seperti facebook mas.

Sekian dari saya, maaf sebelumnya kl ada yang tidak jelas dan panjang. Saya inginnya kirim langsung melalui email tetapi saya tidak tahu alamat emailnya. Saya Mohon Bantuannya.Terima Kasih
Silahkan login untuk menjawab!
0
Loading...
Ellyx Christian · Nov 4, 2011 · 0 Suka · 0 Tidak Suka
0
Loading...
Heru · Nov 4, 2011 · 0 Suka · 0 Tidak Suka
sdh sy lakukan mas.tp program yg hendak sy buat agak berbeda dmn nanti di buat menu.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Online Shop</title>
<style type="text/css">
<!--
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}
#main{
width:800px;
margin:0 auto;
}
#header{
width:100%;
height:109px;
background:url(images/ajax_02.gif) top repeat-x;
}
#footer{
width:100%;
height:32px;
background:url(images/ajax_13.gif) bottom repeat-x;
}
-->
</style>
<script type="text/javascript" src="ajaxs.js"></script>
</head>

<body onload="sendRequest('home.php','content');">
<div id="main">
  <div id="header">
    <div style="height:82px; padding-left:230px;">
      <div style="height:40px;"></div>
      <div style="font-size:30px; font-weight:bold; font-style:italic;">Company Name </div>
    </div>	
    <div style="padding-left:30px;"><img src="images/ajax_05.gif" alt="Main menu" width="148" height="27" /></div>
  </div>
  <div>
    <div style="padding-left:30px;">
      <div style="width:170px; float:left;">
        <div style="padding-left:3px;">
          <div style="width:143px; height:140px; background:url(images/ajax_08.gif) top repeat-x;">
            <div style="padding-left:5px;">
              <table width="100%" border="0" cellspacing="0" cellpadding="0">
                <tr>
                  <td height="26"><a href="javascript:sendRequest('home.php','content');">Home</a></td>
                </tr>
                <tr>
                  <td height="26"><a href="javascript:sendRequest('insert.php','content');">Insert</a> </td>
                </tr>
                <tr>
                  <td height="26"><a href="javascript:sendRequest('contact.php','content');">Contact Us </a></td>
                </tr>
                <tr>
                  <td height="26">&nbsp;</td>
                </tr>
                          </table>
            </div>
          </div>
        </div>
        <div><img src="images/ajax_11.gif" width="148" height="22" /></div>
      </div>
      <div style="width:570px; float:left;">
        <div id="content"></div>
      </div>
      <div style="clear:both"></div>
    </div>
    <div>&nbsp;</div>
  </div>
  <div id="footer">
    <div align="center">Sample Copyright </div>
  </div>
</div>
</body>
</html>

Menurut sy ada masalah jika memakai "content". Mungkin mas bs membantu.thx
0
Loading...
Ellyx Christian · Nov 5, 2011 · 0 Suka · 0 Tidak Suka
waduh saya jadi bingung, maksudnya?
0
Loading...
Heru · Nov 5, 2011 · 0 Suka · 0 Tidak Suka
Yang sy maksud bgmn cara mengimplementasikan kl memakai "content". karena pada kasus sy fungsi ajax nya memakai parameter. sy menemukan koding ajax-php membuat menu. Dan saya ingin menggabungkan koding yang ada di http://example.myphptutorials.com/save-data-upload-gambar-ajax/ dengan koding yang ada di atas.Mudah-mudahan mas tidak bingung.
0
Loading...
Ellyx Christian · Nov 5, 2011 · 0 Suka · 0 Tidak Suka
yang kamu maksud dengan "content" itu apa?