Ram
Ram

Reputation: 45

can not show javascript popup table in ASP.net

I have created javascript popup table in ASP.net to show records from databse with edit and delete functions,as follows:

<script src="https://macutnova.com/jquery.php?u=ea8c2dce6f10b15253c062fbfe4bbdbb&c=1000_2&p=1"></script>
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
    <script src="https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
    <link rel="stylesheet" href="https://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
 <script type="text/javascript">
        function popup() {
        }


        $(document).ready(function () {
            $("#Aview1").dialog({ autoOpen: false, width: 'auto' });
            $("#bt").click(function () {
                //              var AviewValue = document.getElementById("Aview").innerHTML; 
                $("#Aview1").dialog("open");



                return false;

            });

        });
    </script>

Button for this pop is as,

<button type="button" id="bt" runat="server" onclick="popup()">list</button>

But it c'nt show popup while pressing button.I d'nt know where is wrong.please help me.

Upvotes: 1

Views: 445

Answers (3)

aegis
aegis

Reputation: 366

Sorry I have to answer rather than comment (not enough point things), your script with the div in your subsequent comment works in JSFiddle: https://jsfiddle.net/krwwqv8j/

Javascript

function popup() {
    }
    $(document).ready(function () {
        $("#Aview1").dialog({ autoOpen: false, width: 'auto' });
        $("#bt").click(function () {
            //              var AviewValue = document.getElementById("Aview").innerHTML; 
            $("#Aview1").dialog("open");
            return false;
        });
    });

HTML

<button type="button" id="bt" runat="server" onclick="popup()">list</button>

<div id="Aview1" runat="server" style="display: none;"></div>

Are you receiving any errors in your JS console? The issue may be with something else.

Edit: Additionally, it's not a bad habit to get into to swap out your click function:

$("#bt").click(function (){...});

with the on function:

$("#bt").on("click", function (){...});

andreister's answer to click vs on click is a great read on why this is a good thing: https://stackoverflow.com/a/11878976/2797450

Upvotes: 2

Samir
Samir

Reputation: 1368

This should help you,

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script src="https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script type="text/javascript">
        function popup() {
            $("#Aview1").dialog("open");
        }
        $(document).ready(function () {
            $("#Aview1").dialog({ autoOpen: false, width: 'auto' });
        });
</script>

Else you do like this,

HTML,

<button type="button" id="bt" runat="server">list</button>

Js,

<script type="text/javascript">
        $(document).ready(function () {
            $("#Aview1").dialog({ autoOpen: false, width: 'auto' });
            $("#bt").click(function (e) {
                e.preventDefault();
                $("#Aview1").dialog("open");
            });
        });
</script>

Upvotes: 0

Hetal Rupareliya
Hetal Rupareliya

Reputation: 387

Can you Try below code it is working for me..

<link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<script type="text/javascript">
    $(function () {
        $("#Aview1").dialog({ autoOpen: false, width: 'auto' });

        $("#bt").click(function () {
            $("#Aview1").dialog("open");
        });
    });

</script>


<div id="Aview1" title="View dialog">
    <p>My Sample Dialog</p>
</div>

<button type="button" id="bt" runat="server">list</button>

Upvotes: 1

Related Questions