 |
|
มีปัญหา Jquery Scrool to Bottom กับ IE 11 เท่านั้น |
|
 |
|
|
 |
 |
|
ทุกฯ Browser ทำงานได้ปกติ แต่บน IE 11 มันดึงข้อมูลมาครั้งละ 4 x 30 = 120 ระเบียน (แถว)
ต้องแก้ไขอย่างไร? บน IE 11
รูปตัวอย่าง

Markup
Code (VB.NET)
<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/SEX.Master" CodeBehind="NeedSex.aspx.vb" Inherits="SEX.NeedSex" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<script type="text/javascript">
$(document).ready(function () {
//scroll to end div
//$('#dvGrid').scrollTop($('#dvGrid').prop("scrollHeight"));
$('#dvGrid').on("scroll", function () {
if ($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) {
alert('yes Over');
var pageIndex = parseInt($('#<%= hfPageIndex.ClientID%>').val());
var totalPage = parseInt($('#<%= hfTotalPage.ClientID%>').val());
if (pageIndex < totalPage) {
$('#loadingPage').css('display', 'block');
pageIndex = pageIndex + 1;
$('#<%= hfPageIndex.ClientID%>').val(pageIndex.toString());
populateData(pageIndex);
}
}
});
});
function populateData(pageIndex) {
//populate data from database
$.ajax({
url: "NeedSex.aspx/PopulateDataByJquery",
data: "{'pageIndex': " + pageIndex + ", 'noOfRecord': 30}",
type: "POST",
datatype: "json",
contentType: "application/json; charset=utf-8",
success: OnSuccess,
error: function (xhr, ajaxOptions, thrownError) {
alert('นมหก');
}
});
}
function OnSuccess(data) {
var d = data.d
for (var i = 0; i < d.length; i++) {
$('#dvGrid').append(d[i].ID + "<br />");
}
$('#loadingPage').css('display', 'none');
}
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<asp:HiddenField ID="hfPageIndex" runat="server" Value="1" />
<asp:HiddenField ID="hfTotalPage" runat="server" Value="0" />
<div class="box box-default">
<div class="box-header with-border">
<h3 class="box-title">กอเอ๋ยกอไก่ เมียเอ๋ยเมียเขา</h3>
</div>
<div class="box-body">
<div id="dvGrid" style="height: 300px; width: 100%; overflow: auto; background-color: gold;">
</div>
</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
<input id="btnTest" type="button" value="TestEvent" />
<div style="height: 30px;">
<span id="loadingPage" style="color: red; font-weight: bold; display: none;">Pleate wait...</span>
</div>
</asp:Content>
Coding
Code (VB.NET)
Public Class NeedSex
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Session("Data") Is Nothing Then
Dim lst As New List(Of Data)
For i As Integer = 0 To 15000
lst.Add(New Data() With {.ID = i, .Name = i.ToString() & "#"})
Next
Session("Data") = lst
End If
If Not IsPostBack Then
PopulateData(1, 30)
End If
End Sub
Private Sub PopulateData(pageIndex As Integer, noOfRecord As Integer)
Dim pageCount As Integer = 0
Dim totalRecord As Integer = 0
Dim lst = DirectCast(Session("Data"), List(Of Data))
Dim data As List(Of Data) = New List(Of Data)
totalRecord = lst.Count
Dim skip As Integer = (pageIndex - 1) * noOfRecord
data = lst.Skip(skip).Take(noOfRecord).ToList()
Dim strText As String = String.Empty
For i As Integer = 0 To data.Count - 1
strText &= data(i).ID & "<br />"
Next
Dim sb1 As New StringBuilder()
Dim sb2 As New StringBuilder()
sb2.Append("$('#dvGrid').html('" & strText & "');")
sb1.Append("$('#dvGrid').empty();")
ScriptManager.RegisterStartupScript(Me, Me.GetType(), "First30Rows", sb1.ToString() & sb2.ToString(), True)
If (totalRecord > 0 AndAlso noOfRecord > 0) Then
pageCount = (totalRecord \ noOfRecord) + If(totalRecord Mod noOfRecord > 0, 1, 0)
hfTotalPage.Value = pageCount.ToString()
End If
End Sub
<System.Web.Services.WebMethod()>
Public Shared Function PopulateDataByJquery(ByVal pageIndex As Integer, ByVal noOfRecord As Integer) As List(Of Data)
Dim lst = DirectCast(HttpContext.Current.Session("Data"), List(Of Data))
Return lst.Skip((pageIndex - 1) * noOfRecord).Take(noOfRecord).ToList()
End Function
<Serializable>
Public Class Data
Public Property ID As Integer
Public Property Name As String
End Class
End Class
Tag : .NET, Web (ASP.NET)
|
|
 |
 |
 |
 |
Date :
2015-10-28 11:14:57 |
By :
หน้าฮี |
View :
1010 |
Reply :
6 |
|
 |
 |
 |
 |
|
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
จากคำถามผมมีคำตอบอยู่ในใจประมาณ 1,000 วิธี
แต่สิ่งที่ต้องการจริงฯก็คือวิธีที่ >= 1,001 เท่านั้นเองครับ
ปล. หายากมากฯ "ช้างเผือกในเมืองหลวง/ในดง"
|
 |
 |
 |
 |
Date :
2015-10-28 12:32:05 |
By :
หน้าฮี |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
@DOG{B} /...
ผมอยากเห็นแนวทางที่แตกต่าง?
ขอบคุณครับ
ปล. ชั้น/ภพภูมิของคนเรามันแตกต่างกัน แต่ผมดีใจที่ได้เจอคุณอีกครั้งหนึ่ง
|
 |
 |
 |
 |
Date :
2015-10-30 20:04:27 |
By :
หน้าฮี |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ขอติดก่อนนะครับ กำลังปล้ำ passadu อยู่โละของเก่าออกแล้วเอาของใหม่ใส่แทน
งานแทรกแถมด่วนก็ทะยอยมาเป็นระลอกๆ หากพอมีเวลาจะเอาไปตั้งวิเคราะห์
ให้ถี่ถ้วนครับผม
|
 |
 |
 |
 |
Date :
2015-11-01 11:28:43 |
By :
DOG{B} |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
แก้ไขคำผิด Scrool เป็น Scroll
รบกวน Admin ช่วยแก้ไขให้ด้วยครับ
ขอบคุณครับ
|
 |
 |
 |
 |
Date :
2015-11-02 18:52:46 |
By :
หน้าฮี |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
วันนี้พอมีเวลาว่างมานั่งแงะกับมัน "ปัญหานี้ผ่านไปได้ด้วยดีสำหรับ IE 11 โดยหน่วงเวลาด้วย debounce"
"http://benalman.com/projects/jquery-throttle-debounce-plugin/"
มันทำงานคล้ายฯกับฟังก์ชั่น setTimeout(function () {//หยุดเวลา/หน่วงเวลา}, 500);
Code (JavaScript)
<script src="<%# Page.ResolveUrl("~/")%>Scripts/jquery-throttle-debounce.js" type="text/javascript"></script>
$('#dvGrid').on("scroll", $.debounce(500, function () {
//e.preventDefault();
if ($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) {
var pageIndex = parseInt($('#<%= hfPageIndex.ClientID%>').val());
var totalPage = parseInt($('#<%= hfTotalPage.ClientID%>').val());
if ((pageIndex < totalPage)) {
$('#loadingPage').css('display', 'block');
pageIndex = pageIndex + 1;
$('#<%= hfPageIndex.ClientID%>').val(pageIndex.toString());
populateData(pageIndex);
}
}
}));
ปล. ปัญหาลดน้อยลงไปอีกเปลาะหนึ่งแต่ตัญหากลับเพิ่มขึ้น
|
 |
 |
 |
 |
Date :
2016-01-05 10:02:03 |
By :
หน้าฮี |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
|
|