Hi i want to move to the page number as we enter page number in textbox

Move to the page as we enter the page number in textbox using javascript

Shirin

0 6

Reply
User: Shirin
Replied: on Dec 01, 2011 02:28 AM
Report

Actually m not gettin g your answer.

Please explain brifly.

Mudassar

0 7

Reply
User: Mudassar
Replied: on Dec 01, 2011 02:31 AM
Report

I'll explain. Give your DIVs ID as per their location.

Meaning first DIV dv1 second div dv2

And then use my script. Suppose user types 1. It will load dv1

Shirin

0 8

Reply
User: Shirin
Replied: on Dec 01, 2011 02:44 AM
Report

KKK.

I have given the div tag one as div1 ,and so on.

But when i click on button it is not working ,Is their any need to write something on button events.

<asp:Button ID="btnpageno" runat="server" Text="Go" />

I have taken button as above.

Is there any missing ...

And as the script

$("#txtPageno").live("onchange", function () { $("[id$=dv]").hide(); $("#dv" + $(this).val()).show(); });

how can it take id of all three div

can u explain???

Mudassar

0 9

Reply
User: Mudassar
Replied: on Dec 01, 2011 02:59 AM
Report

If you want to do on button click then this way

<input type = "button"  id = "btnPage" value = "Go" />

$("#btnPage").live("onchange", function () {
            $("[id$=dv]").hide();
            $("#dv" + $("#txtPageno").val()).show();
        });

Shirin

0 10

Reply
User: Shirin
Replied: on Dec 01, 2011 03:10 AM
Report

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DragDrop.aspx.cs" Inherits="DragDrop2.DragDrop" %>

<!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 runat="server">
    <title></title>
    <link rel="stylesheet" type="text/css" href="../StyleSheet1.css"/>


     <link rel="stylesheet" type="text/css" href="../Jquerycycle/StyleSheet1.css"/>
      <link rel="stylesheet" type="text/css" href="../Jquerycycle/StyleSheet2.css"/>

    <script type="text/javascript" src="../Jquerycycle/JScript1Cyc.js"></script>
    <script type="text/javascript" src="../Jquerycycle/JScript3.js"></script>
    <script type="text/javascript" src="../Jquerycycle/JScript4.js"></script>
    <script type="text/javascript" src="../Jquerycycle/JScript5.js"></script>
<script type="text/javascript">
        

        $('#s5').cycle({
            fx: 'scrollHorz',
            timeout: 500,
            next: '#next1',
            prev: '#prev1',
            timeout: 0,
            pager: '#nav',
            nowrap: 1
        });



        $('#prev').click(function () {
            return false;
        });

        $('#next').click(function () {
            return false;
        });

        $("#btnPage").live("onchange", function () {
            $("[id$=dv]").hide();
            $("#dv" + $("#txtPageno").val()).show();
        });
       
</script>

  <script type="text/javascript" src="../JqueryMove/JScript1.js"></script>
    <script type="text/javascript" src="../JqueryMove/JScript2.js"></script>
<script type="text/javascript">
    $(init);

    function init() {
        $('.movable').draggable({
            cursor: 'move',
            containment: '#s5',
            cursor: 'move',
            snap: '#s5',
            stop: handleDragStop
        });
    }


    function handleDragStop(event, ui) {
        var offsetXPos = parseInt(ui.offset.left);
        var offsetYPos = parseInt(ui.offset.top);
        alert("Drag stopped!\n\nOffset: (" + offsetXPos + ", " + offsetYPos + ")\n");
    }
</script>
</head>
<body>
    <form id="form1" runat="server">
  <div id="s5"> 
<div id="div1" style="width:500px; height:500px; border:10px soild #ffffff;background-color:Aqua;" >
    <center>
    <div style="width:500px; height:500px; border:10px soild #ffffff; background-color:Aqua;">
     <div id="Div2" style="padding-left:100px; float:left;">
     <div   style="padding-left:200px;">Product Details <br /> Product name<br /> Product Id</div>
        </div>
      <div  id="Div3" style="padding-left:100px; float:left;"><img class="movable" src="../Images/1.png" width="70" height="70" alt="Product1"/></div>
        <img class="movable" src="../Images/1.png" width="70" height="70" alt="Product1"/><div    style="padding-left:200px;">Product Details <br /> Product name<br /> Product Id</div>
      <div  id="Div4" style="padding-left:100px; float:left;"><img class="movable" src="../Images/1.png" width="70" height="70" alt="Product1"/></div>
     <div   style="padding-left:200px;">Product Details <br /> Product name<br /> Product Id</div>
      <div id="Div5" style="padding-left:100px; float:left;"><img class="movable" src="../Images/1.png" width="70" height="70" alt="Product1"/></div>
      <div style="padding-left:200px;">Product Details <br /> Product name<br /> Product Id</div>
    </div>
    </center>

</div>
<div id="div2" style="width:500px; height:500px; border:10px soild #ffffff;background-color:Fuchsia" >
    <center>
    <div style="width:500px; height:500px; border:10px soild #ffffff; background-color:Fuchsia;">
     <div id="Div7" style="padding-left:100px; float:left;"><img class="movable" src="../Images/1.png" width="70" height="70" alt="Product1"/></div>
     <div   style="padding-left:200px;">Product Details <br /> Product name<br /> Product Id</div>
      <div  id="Div8" style="padding-left:100px; float:left;"><img class="movable" src="../Images/1.png" width="70" height="70" alt="Product1"/></div>
      <div    style="padding-left:200px;">Product Details <br /> Product name<br /> Product Id</div>
      <div  id="Div9" style="padding-left:100px; float:left;"><img class="movable" src="../Images/1.png" width="70" height="70" alt="Product1"/></div>
     <div   style="padding-left:200px;">Product Details <br /> Product name<br /> Product Id</div>
      <div id="Div10" style="padding-left:100px; float:left;"><img class="movable" src="../Images/1.png" width="70" height="70" alt="Product1"/></div>
      <div style="padding-left:200px;">Product Details <br /> Product name<br /> Product Id</div>
    </div>
    </center>
</div>

<div id="div3" style="width:500px; height:500px; border:10px soild #ffffff;background-color:Gray;" >
    <center>
    <div style="width:500px; height:500px; border:10px soild #ffffff; background-color:Gray;">
     <div class="Div12" style="padding-left:100px; float:left;"><img class="movable" src="../Images/1.png" width="70" height="70" alt="Product1"/></div>
     <div class="Div12"  style="padding-left:200px;">Product Details <br /> Product name<br /> Product Id</div>
      <div  id="Div13" style="padding-left:100px; float:left;"><img class="movable" src="../Images/1.png" width="70" height="70" alt="Product1"/></div>
      <div    style="padding-left:200px;">Product Details <br /> Product name<br /> Product Id</div>
      <div  id="Div14" style="padding-left:100px; float:left;"><img class="movable" src="../Images/1.png" width="70" height="70" alt="Product1"/></div>
     <div   style="padding-left:200px;">Product Details <br /> Product name<br /> Product Id</div>
      <div id="Div15" style="padding-left:100px; float:left;"><img class="movable" src="../Images/1.png" width="70" height="70" alt="Product1"/></div>
      <div style="padding-left:200px;">Product Details <br /> Product name<br /> Product Id</div>
    </div>
    </center>
</div>
</div>
<div id="nav">
    
    <asp:Button ID="next1" runat="server" Text="Next" />
    <asp:Button ID="prev1" runat="server" Text="Prev" />
   
</div>
    <asp:TextBox ID="txtPageno" runat="server"></asp:TextBox>
    <input type = "button"  id = "btnPage" value = "Go" runat="server" />
</form>
</body>
</html>

this is my code.

But still not working

you please check that as per your suggestion i had put the div id's correct or not

because I m confused naw.

Move to the page as we enter the page number in textbox using javascript

Company

Explore

Follow us

Contact Us