Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
 

Registered : 108,967

HOME > PHP > PHP Forum > web Page ทำ lIstView ให้สามารถกดไปดูรายละเอียดได้ โดยดึงข้อมูลมาจาก SQL server



 

web Page ทำ lIstView ให้สามารถกดไปดูรายละเอียดได้ โดยดึงข้อมูลมาจาก SQL server

 



Topic : 125717



โพสกระทู้ ( 106 )
บทความ ( 0 )



สถานะออฟไลน์




web Page ทำ lIstView ให้สามารถกดไปดูรายละเอียดได้ โดยดึงข้อมูลมาจาก SQL server อยากทำแบบตัวอย่างด้านล่างอ่าคะ แนะนำหน่อยนะคะ โดยตอนนี้เรามีไฟล์ Json ซึ่งเป็น .php เราอยากดึงข้อมูลมาแสดง โดยหน้าเพจเป็น Html5

ขอบคุณคะ


1


2



Tag : PHP, Ms SQL Server 2008, Ms SQL Server 2012, HTML/CSS, JavaScript, Ajax









ประวัติการแก้ไข
2016-12-13 12:27:05
Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2016-12-13 12:26:34 By : aummyasia View : 1100 Reply : 5
 

 

No. 1



โพสกระทู้ ( 74,058 )
บทความ ( 838 )

สมาชิกที่ใส่เสื้อไทยครีเอท

สถานะออฟไลน์
Twitter Facebook

ในรูปน่าจะ jQuery Mobile ครับ ส่วนวิธีดึง JSON มาแสดง ไม่ยากครับ

PHP และ JSON กับ Web Service การรับส่งข้อมูลจาก MySQL ในรูปแบบขอ







แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-12-13 13:26:32 By : mr.win
 


 

No. 2



โพสกระทู้ ( 106 )
บทความ ( 0 )



สถานะออฟไลน์


ตอบความคิดเห็นที่ : 1 เขียนโดย : mr.win เมื่อวันที่ 2016-12-13 13:26:32
รายละเอียดของการตอบ ::
ช่วยอธิบายโค๊ด js ให้ได้ไหมคะ ไม่ค่อยเข้าใจโค๊ด



Code (JavaScript)
  var url = 'http://api.themoviedb.org/3/',
        mode = 'search/movie?query=',
        movieName = '&query='+encodeURI('Batman'),        
        key = '&api_key=5fbddf6b517048e25bc3ac1bbeafb919';


Code (JavaScript)
$(document).on('pageinit', '#home', function(){      
    var url = 'http://api.themoviedb.org/3/',
        mode = 'search/movie?query=',
        movieName = '&query='+encodeURI('Batman'),        
        key = '&api_key=5fbddf6b517048e25bc3ac1bbeafb919';        
    
    $.ajax({
        url: url + mode + key + movieName ,
        dataType: "jsonp",
        async: true,
        success: function (result) {
            ajax.parseJSONP(result);
        },
        error: function (request,error) {
            alert('Network error has occurred please try again!');
        }
    });         
});

$(document).on('pagebeforeshow', '#headline', function(){      
    $('#movie-data').empty();
    $.each(movieInfo.result, function(i, row) {
        if(row.id == movieInfo.id) {
            $('#movie-data').append('<li><img src="http://image.tmdb.org/t/p/w92'+row.poster_path+'"></li>');
            $('#movie-data').append('<li>Title: '+row.original_title+'</li>');
            $('#movie-data').append('<li>Release date'+row.release_date+'</li>');
            $('#movie-data').append('<li>Popularity : '+row.popularity+'</li>');   
            $('#movie-data').append('<li>Popularity : '+row.vote_average+'</li>');             
            $('#movie-data').listview('refresh');            
        }
    });    
});

$(document).on('vclick', '#movie-list li a', function(){  
    movieInfo.id = $(this).attr('data-id');
    $.mobile.changePage( "#headline", { transition: "slide", changeHash: false });
});

var movieInfo = {
    id : null,
    result : null
}

var ajax = {  
    parseJSONP:function(result){  
        movieInfo.result = result.results;
        $.each(result.results, function(i, row) {
            console.log(JSON.stringify(row));
            $('#movie-list').append('<li><a href="" data-id="' + row.id + '"><img src="http://image.tmdb.org/t/p/w92'+row.poster_path+'"/><h3>' + row.title + '</h3><p>' + row.vote_average + '/10</p></a></li>');
        });
        $('#movie-list').listview('refresh');
    }
}





ประวัติการแก้ไข
2016-12-13 16:31:53
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-12-13 16:29:02 By : aummyasia
 

 

No. 3



โพสกระทู้ ( 5,105 )
บทความ ( 4 )

สมาชิกที่ใส่เสื้อไทยครีเอท Hall of Fame 2012

สถานะออฟไลน์


อธิบายบรรทัดไหนครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-12-13 19:23:33 By : apisitp
 


 

No. 4



โพสกระทู้ ( 106 )
บทความ ( 0 )



สถานะออฟไลน์


ตอบความคิดเห็นที่ : 3 เขียนโดย : apisitp เมื่อวันที่ 2016-12-13 19:23:33
รายละเอียดของการตอบ ::

ส่วนนี้คะ อยากทราบว่า ลิ้งมาจากไหนบ้างอ่าคะ

Code (JavaScript)
var url = 'http://api.themoviedb.org/3/',
      mode = 'search/movie?query=',
      movieName = '&query='+encodeURI('Batman'),        
      key = '&api_key=5fbddf6b517048e25bc3ac1bbeafb919';


แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-12-14 11:37:44 By : aummyasia
 


 

No. 5



โพสกระทู้ ( 5,105 )
บทความ ( 4 )

สมาชิกที่ใส่เสื้อไทยครีเอท Hall of Fame 2012

สถานะออฟไลน์


link มาจากไหน....ก็มาจาก http://api.themoviedb.org ไม่ใช่หร๋อครับ...
แล้วคุณใช้งานทีแรก ไปเอา api ไปเอา key จากไหนมาอ่ะครับ มันก็ต้องสมัครสมาชิกก่อน หรือ ยังไง ผมก็งงๆ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-12-14 14:03:57 By : apisitp
 

   

ค้นหาข้อมูล


   
 

แสดงความคิดเห็น
Re : web Page ทำ lIstView ให้สามารถกดไปดูรายละเอียดได้ โดยดึงข้อมูลมาจาก SQL server
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ FTP| ใส่แถวของตาราง ใส่คอลัมน์ตาราง| ตัวยก ตัวห้อย ตัวพิมพ์ดีด| ใส่โค้ด ใส่การอ้างถึงคำพูด| ใส่ลีสต์
smiley for :lol: smiley for :ken: smiley for :D smiley for :) smiley for ;) smiley for :eek: smiley for :geek: smiley for :roll: smiley for :erm: smiley for :cool: smiley for :blank: smiley for :idea: smiley for :ehh: smiley for :aargh: smiley for :evil:
Insert PHP Code
Insert ASP Code
Insert VB.NET Code Insert C#.NET Code Insert JavaScript Code Insert C#.NET Code
Insert Java Code
Insert Android Code
Insert Objective-C Code
Insert XML Code
Insert SQL Code
Insert Code
เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

   
  เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง
 
โดย
อีเมล์
บวกค่าให้ถูก
<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)







Exchange: Voake, Comcube, รับทำเว็บไซต์ รับเขียนโปรแกรม , pangpond.com , pangpond.co.th , สำนักงานบัญชี.com , รถมือสอง

Load balance : Server 00
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2022 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 อัตราราคา คลิกที่นี่