Hello, Im new in Ajax..
i try to make an ajax input, and show the result without refresh page.
i've success to input data with ajax (pure ajax), but i cann't show the result ??
when i look for a problem, .. it couse of the there a line break inside data field.
im using input and textrea,
i can show the data from input fields.
but can't show the data from textarea (data with <br>)?
You'd have to show some of your sample code so we can get a better understanding of the problem.
<article id="post">
<form name="form1">
<table>
<tr>
<td colspan='3'><input type="text" name="judul" placeholder="subject" id="judul" style='width:525px;'></td>
</tr>
<tr>
<td colspan='3'>
<textarea name="isi" id="isi" class="redactorr" style='width:525px;'></textarea>
</td>
</tr>
<tr>
<td></td><td></td><td class='tomR'><select name="id_sub" onchange=\"pilih(this.form)\" id="id_sub">
<option value="0" selected class=opsi>--- Select a Category ---</option>
<?php
$yeni=mysqli_query($con,"select * from arc_kategori order by id_kategori ASC");
while($a=mysqli_fetch_array($yeni)){
echo"<option disabled class=list>$a[kategori]</option>";
$yen=mysqli_query($con,"select * from arc_sub where id_kategori=$a[id_kategori] order by id_sub");
while($bb=mysqli_fetch_array($yen)){
echo"
<ul><option value=$bb[id_sub] class=list-sub> › $bb[sub_kategori]</option></ul>";
}
echo" ";
}
$tgl=date("Y-m-d H:i:s");
echo"</select><input type=hidden name=date value='$tgl'>";
?><input class='botom' type="button" value='Send' onclick="simpann()"></td>
</tr>
</table>
</form>
</article>
my input form
var xmlHttp = createXmlHttpRequestObject();
function createXmlHttpRequestObject()
{
var xmlHttp;
if (window.ActiveXObject)
{
try
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e)
{
xmlHttp= false;
}
}
else
{
try
{
xmlHttp=new XMLHttpRequest();
}
catch(e)
{
xmlHttp=false;
}
}
if (!xmlHttp) alert ("Object XMLHttpRequest gagal dibuat !");
else
return xmlHttp;
}
function tampil()
{
if (xmlHttp.readyState ==4 || xmlHttp.readyState ==0 )
{
xmlHttp.open ("GET","account/modul/aksi.php?act=tampilarticle",true);
xmlHttp.onreadystatechange = handleServerResponse;
xmlHttp.send(null);
}
else
setTimeout('tampil()',1000);
}
function simpann()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState==0)
{
judul =encodeURIComponent(document.getElementById("judul").value);
isi =encodeURIComponent(document.getElementById("isi").value);
id_sub=encodeURIComponent(document.getElementById("id_sub").value);
/*id_kategori=encodeURIComponent(document.getElementById("id_kategori").value);
id_news=encodeURIComponent(document.getElementById("id_news").value);
id_userarc=encodeURIComponent(document.getElementById("id_userarc").value);
judul_seo=encodeURIComponent(document.getElementById("judul_seo").value);
cover=encodeURIComponent(document.getElementById("cover").value);
counter=encodeURIComponent(document.getElementById("counter").value);
status=encodeURIComponent(document.getElementById("status").value);
date=encodeURIComponent(document.getElementById("date").value);
likearc=encodeURIComponent(document.getElementById("likearc").value);
unlikearc=encodeURIComponent(document.getElementById("unlikearc").value);
kesalahan semula: kurang tanda sama dengan setelah op=simpandata&&nim +"&id_kategori="+id_kategori+"&id_userarc="+id_userarc+"&judulseo="+judul_seo+"&isi="+isi+"&cover="+cover+"&counter="+counter+"&status="+status+"&date="+date+"&likearc="+likearc+"&unlikearc="+unlikearc*/
xmlHttp.open("GET","account/modul/aksi.php?modul=article&act=inputarticle&judul="+judul+"&isi="+isi+"&id_sub="+id_sub,true);
xmlHttp.onreadystatechange = handleServerResponse;
xmlHttp.send(null);
}
else
setTimeout('simpann()',1000);
}
function handleServerResponse()
{
if (xmlHttp.readyState==4)
{
if (xmlHttp.status == 200)
{
var xmlResponse = xmlHttp.responseXML;
xmlRoot =xmlResponse.documentElement;
id_NewsArray = xmlRoot.getElementsByTagName("id_news");
judulArray = xmlRoot.getElementsByTagName("judul");
isiArray = xmlRoot.getElementsByTagName("isi");
id_kategoriArray = xmlRoot.getElementsByTagName("id_kategori");
id_subArray = xmlRoot.getElementsByTagName("id_sub");
html = "<table border='1' width=200><tr><th>NIM</th><th>Judul</th><th>Id Kategori</th><th>Content</th><th>id_sub</th><th>Act</th></tr>";
for (var i=0; i<id_NewsArray.length; i++)
{//" + isiArray.item(i).firstChild.data + "" + id_subArray.item(i).firstChild.data + "
html += "<tr><td>" + id_NewsArray.item(i).firstChild.data + "</td><td>" + judulArray.item(i).firstChild.data + "</td><td>" + id_kategoriArray.item(i).firstChild.data + "</td><td><table border=1><tr><td>kenapa?<br>ppp</td></tr></table><br></td><td>" + id_subArray.item(i).firstChild.data + "</td><td><a href=\"datamhs.php\" onclick=\"hapus('"+id_NewsArray.item(i).firstChild.data+"'); return false;\">Hapus</a></td></tr>";
}
html = html + "</table>";
document.getElementById("datta").innerHTML = html;
}
else
{
alert("Ada kesalahan dalam mengakses server : " + xmlHttp.statusText);
}
}
else
{
// jika belum, maka tampilkan image loadingnya
document.getElementById("datta").innerHTML = "<img src='root/image/load.gif'>";
}
}
function hapus(nim)
{
if (xmlHttp.readyState==4 || xmlHttp.readyState==0)
{
xmlHttp.open("GET","ajax/datamhs.php?op=hapusdata&yui="+nim,true);
xmlHttp.onreadystatechange = handleServerResponse;
xmlHttp.send(null);
}
else
setTimeout('hapus()',1000);
}
my action.js (AJAX)
and this
<p><strong>Data yang sudah masuk :<div id="datta" ></div></strong></p>
==> i already success to input data using ajax
But unfortunately i cant select the data "isi" from database becouse there is line break exist.
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.