[ASK] Memanggil file .js lewat AJAX

Forum diskusi mengenai client-side scripting Javascript dan framework-framework yang mendukungnya

Moderator: irzan2010

[ASK] Memanggil file .js lewat AJAX

Postby vbgila » 17 Feb 2012, 13:31

Langsung aja,,ane punya 2 buah file


index.php
Code: Select all
<html>
<head>
   
<script language = "javascript">
var XMLHttpRequestObject=false;
if (window.XMLHttpRequest) {
  XMLHttpRequestObject = new XMLHttpRequest();
} else if (window.ActiveXObject) {
  XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHttp");
}
function getdata(url,divhasil) {
  if (XMLHttpRequestObject) {
    var obj = document.getElementById(divhasil);
   
    XMLHttpRequestObject.open("GET", url);
    XMLHttpRequestObject.onreadystatechange = function() {
    if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200) {
      obj.innerHTML = XMLHttpRequestObject.responseText;
    }
    }
  XMLHttpRequestObject.send(null);
  }
}
</script>
</head>
<body>
<h1>Mengambil data dengan AJAX</h1>

<a href="javascript:void(0)" onclick="getdata('tampil.php','divhasil')">Menu 1</a>
<a href="javascript:void(0)" onclick="getdata('tampil2.html','divhasil')">Menu 2</a>
<a href="javascript:void(0)" onclick="getdata('tampil3.html','divhasil')">Menu 3</a>

<div id="divhasil">
   <? include "tampil.php";  ?>
</div>



</body>
</html>


tampil.php
Code: Select all
   
   <script type="text/javascript" src="./js/jquery.min.js"></script> <!--file js-->
   <script type="text/javascript" src="./js/jquery-ui.min.js"></script> <!--penfile jsyebab-->

      <div id="slider" >
            <div id="imageSlider">
               <img src="./images/sliders/01.jpg" width="807" height="523"  />
               <img src="./images/sliders/02.jpg" width="807" height="523" />
               <img src="./images/sliders/03.jpg" width="807" height="523"  />
               <img src="./images/sliders/04.jpg" width="807" height="523"/>
               <img src="./images/sliders/05.jpg" width="807" height="523"  />
            </div><!--/ imageSlider-->
      </div><!--/ slider-->   
         <!-- End Slider -->
         
   <script type="text/javascript" src="./js/general.js"></script> <!--file js-->


1. Pada awal dijalankan index.php, maka gambar slider akan diload (dari file tampil.php) dan slider bisa berjalan
2. Ketika kita memilih Menu 2 ato Menu 3, maka akan di load isi dari tampil2.html/tampil3.html (isinya hello word).
3. Setelah memilih Menu 2 ato Menu 3,, ane klik Menu 1. Memang benar yang di load kan tampil.php,,(hal itu ane buktikan dengan melihat source code),,tapi kenapa slider tidak jalan ?? malah gambarnya jadi ga tampil,,padahal di source code udah di load,,

ane punya asumsi klo sebenarnya file .js yang ane tandai tidak dijalankan. mungkin ada yang punya solusi untuk kasus ane,,
maklum baru belajar AJAX :D

matur thank you,,
Salam SuperImage
User avatar
vbgila
Prajurit Kepala
Prajurit Kepala
 
Posts: 328
Joined: 27 Jun 2011, 13:24
Location: Dunia Fana
Memberi kopi: 37 cangkir
Mendapat kopi: 55 cangkir

Re: [ASK] Memanggil file .js lewat AJAX

Postby adjiesaka » 17 Feb 2012, 19:26

Code: Select all
if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200) {
                     
    // sepertinya script yang ada di page tidak di eval
    // dicoba cara ini, siapa tau membantu
   
    var html     = XMLHttpRequestObject.responseText,
        doc     = document,
        hd        = doc.getElementsByTagName("head")[0],
        regex     = /(?:<script([^>]*)?>)((\n|\r|.)*?)(?:<\/script>)/ig,
        regexSrc = /\ssrc=([\'\"])(.*?)\1/i,
        regexTyp = /\stype=([\'\"])(.*?)\1/i,
        match,
        attrs,
        srcMatch,
        typMatch,
        s;
   
    // loop semua kemungkinan adanya <script> di halaman
    while ((match = regex.exec(html))) {
        attrs = match[1];
       
        srcMatch = attrs ? attrs.match(regexSrc) : false;
        //jika ada script src
        if (srcMatch && srcMatch[2]) {
           
            s = doc.createElement("script");
            s.src = srcMatch[2];
            typMatch = attrs.match(regexTyp);
            if (typMatch && typMatch[2]) {
                s.type = typMatch[2];
            }
           
            hd.appendChild(s);
           
        } else if (match[2] && match[2].length > 0) {
            // jika cuma ada script type
            if (window.execScript) {
                window.execScript(match[2]);
            } else {
                alert(match[2]);
                window.eval(match[2]);
            }
           
        }
    }
   
    obj.innerHTML = html;
   
}
adjiesaka
Prajurit Dua
Prajurit Dua
 
Posts: 9
Joined: 09 Feb 2012, 00:20
Memberi kopi: 0 cangkir
Mendapat kopi: 0 cangkir

Re: [ASK] Memanggil file .js lewat AJAX

Postby vberror13 » 17 Feb 2012, 19:50

Saya lihat si oom juga pasang jquery. kenapa nggak pake ajax-nya jquery aja, oom?
Kemudian supaya nggak pusing memecahkan persoalan begitu, kita atur aja supaya tampil.phpnya cuma berisi html element dan element script yang bisa langsung dipanggil.
:ymbilly: :ymbilly: :ymbilly: =:) :ymbilly:
Just Because You Are Unique, Doesn't Mean You Are Useful
User avatar
vberror13
Global Moderator
Global Moderator
 
Posts: 1846
Joined: 13 Mar 2010, 20:34
Location: Medan Indonesia
Memberi kopi: 296 cangkir
Mendapat kopi: 321 cangkir

Re: [ASK] Memanggil file .js lewat AJAX

Postby adjiesaka » 17 Feb 2012, 20:06

Ho o bener tuh, w baru liat dianya pake jquery. Bener bener, ga perlu evalute lagi tinggal $.load();
adjiesaka
Prajurit Dua
Prajurit Dua
 
Posts: 9
Joined: 09 Feb 2012, 00:20
Memberi kopi: 0 cangkir
Mendapat kopi: 0 cangkir

Re: [ASK] Memanggil file .js lewat AJAX

Postby vbgila » 17 Feb 2012, 20:17

adjiesaka wrote:
Code: Select all
if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200) {
                     
    // sepertinya script yang ada di page tidak di eval
    // dicoba cara ini, siapa tau membantu
   
    var html     = XMLHttpRequestObject.responseText,
        doc     = document,
        hd        = doc.getElementsByTagName("head")[0],
        regex     = /(?:<script([^>]*)?>)((\n|\r|.)*?)(?:<\/script>)/ig,
        regexSrc = /\ssrc=([\'\"])(.*?)\1/i,
        regexTyp = /\stype=([\'\"])(.*?)\1/i,
        match,
        attrs,
        srcMatch,
        typMatch,
        s;
   
    // loop semua kemungkinan adanya <script> di halaman
    while ((match = regex.exec(html))) {
        attrs = match[1];
       
        srcMatch = attrs ? attrs.match(regexSrc) : false;
        //jika ada script src
        if (srcMatch && srcMatch[2]) {
           
            s = doc.createElement("script");
            s.src = srcMatch[2];
            typMatch = attrs.match(regexTyp);
            if (typMatch && typMatch[2]) {
                s.type = typMatch[2];
            }
           
            hd.appendChild(s);
           
        } else if (match[2] && match[2].length > 0) {
            // jika cuma ada script type
            if (window.execScript) {
                window.execScript(match[2]);
            } else {
                alert(match[2]);
                window.eval(match[2]);
            }
           
        }
    }
   
    obj.innerHTML = html;
   
}


ane bingung baca code-na om,,maklum newbi,,
ntar ane pelajari dl :D

vberror13 wrote:Saya lihat si oom juga pasang jquery. kenapa nggak pake ajax-nya jquery aja, oom?
Kemudian supaya nggak pusing memecahkan persoalan begitu, kita atur aja supaya tampil.phpnya cuma berisi html element dan element script yang bisa langsung dipanggil.


sebenernya awalnya script js nya ada di bagian head dan body om,,

Code: Select all
<html>
<head>
   <script type="text/javascript" src="./js/jquery.min.js">
   <script type="text/javascript" src="./js/jquery-ui.min.js">
</head>

   

<body>

   <div id="divhasil">
           <? include "tampil.php";  ?>
   </div>
   <script type="text/javascript" src="./js/general.js"></script>
</body>
</html>


***kode diatas yg bagian AJAX nya ane potong biar singkat <:D> (tetep ky yg awal cm pgn nunjukin beda letak file .js nya)***

karena ga bs jln trus ane masukin <script> nya ke tampil.php,,eh tyt ga bs jg :))
cara ngeloadnya gmn om??
Salam SuperImage
User avatar
vbgila
Prajurit Kepala
Prajurit Kepala
 
Posts: 328
Joined: 27 Jun 2011, 13:24
Location: Dunia Fana
Memberi kopi: 37 cangkir
Mendapat kopi: 55 cangkir

Re: [ASK] Memanggil file .js lewat AJAX

Postby adjiesaka » 17 Feb 2012, 20:24

vbgila wrote:ane bingung baca code-na om,,maklum newbi,,
ntar ane pelajari dl :D


itu kan cuma script buat ngeloop apakah di page situ ada tag <script....></script>,
kalo ada cek lagi, kalo dia ada attribut src langsung tambahkan ke header,
kalo cuma <script type="text/javascript">...</script> langsung di eval
adjiesaka
Prajurit Dua
Prajurit Dua
 
Posts: 9
Joined: 09 Feb 2012, 00:20
Memberi kopi: 0 cangkir
Mendapat kopi: 0 cangkir

Re: [ASK] Memanggil file .js lewat AJAX

Postby vbgila » 18 Feb 2012, 01:40

Code: Select all
<html>
<head>
      <script type="text/javascript" src="./js/jquery.min.js" ></script>
      <script type="text/javascript" src="./js/jquery-ui.min.js"></script>
   
<script type="text/javascript">
$(function() {
   $('#nav a').click(function() {
      var url = $(this).attr('href');
      
      $('#divhasil').load(url);
      
      return false;
   });
});
</script>
</head>

<body>
<h1>Mengambil data dengan AJAX</h1>

<div id="nav">
      <a href="tampil.php">Menu 1</a>
      <a href="tampil2.html">Menu 2</a>
      <a href=tampil3.html')">Menu 3</a>
</div>

<div id="divhasil">
   <? include "tampil.php";  ?>
</div>

<script type="text/javascript" src="./js/general.js"></script>

</body>
</html>




ane coba pake teknik jquery ky saran om vberror13,,tyt lbh simple :">
tp tetep slidernya g bisa jln,,gmn nih oom :((

slidernya jln cm pas pertama kali hlmn di-load,,
klo udah pindah menu trus ke Menu 1 lagi,, sidernya ga jln :(
Salam SuperImage
User avatar
vbgila
Prajurit Kepala
Prajurit Kepala
 
Posts: 328
Joined: 27 Jun 2011, 13:24
Location: Dunia Fana
Memberi kopi: 37 cangkir
Mendapat kopi: 55 cangkir

Re: [ASK] Memanggil file .js lewat AJAX

Postby vberror13 » 18 Feb 2012, 01:50

file general.js isinya apa, oom? script untuk membuat slider ?
:ymbilly: :ymbilly: :ymbilly: =:) :ymbilly:
Just Because You Are Unique, Doesn't Mean You Are Useful
User avatar
vberror13
Global Moderator
Global Moderator
 
Posts: 1846
Joined: 13 Mar 2010, 20:34
Location: Medan Indonesia
Memberi kopi: 296 cangkir
Mendapat kopi: 321 cangkir

Re: [ASK] Memanggil file .js lewat AJAX

Postby vbgila » 18 Feb 2012, 02:01

vberror13 wrote:file general.js isinya apa, oom? script untuk membuat slider ?


iye omm,,klo itu g dipanggil slidernya g jln,,
Salam SuperImage
User avatar
vbgila
Prajurit Kepala
Prajurit Kepala
 
Posts: 328
Joined: 27 Jun 2011, 13:24
Location: Dunia Fana
Memberi kopi: 37 cangkir
Mendapat kopi: 55 cangkir

Re: [ASK] Memanggil file .js lewat AJAX

Postby vbgila » 18 Feb 2012, 02:07

ane pake nivo slider,,ini file general.js yg hrs dipanggil
general.js
(7.41 KiB) Downloaded 4 times
Salam SuperImage
User avatar
vbgila
Prajurit Kepala
Prajurit Kepala
 
Posts: 328
Joined: 27 Jun 2011, 13:24
Location: Dunia Fana
Memberi kopi: 37 cangkir
Mendapat kopi: 55 cangkir

Next

Return to Javascript and Framework

Who is online

Users browsing this forum: No registered users and 1 guest