can not show javascript popup table in ASP.net

Question

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.

where is your element with id `Aview1`? Can't see in your HTML — vijayP, Nov 04 '16 at 05:11
`function popup` is empty, how the popup will be shown ? @Ram — PaulShovan, Nov 04 '16 at 05:16
this same javascript function is working on another project.this project only d'nt show.How can i change my code.Can you help me — Ram, Nov 04 '16 at 05:20

score 2 · Answer 1 · edited May 23 '17 at 12:06

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

I c'nt past source code in comment box , it exceeds the limit — Ram, Nov 04 '16 at 05:40
None of these are work for me, i think i made a mistake while creating a project — Ram, Nov 04 '16 at 06:04
Can you confirm that your javascript console is error free when you run your code? Failing that, don't try to paste your code in the comment box, update your original post with the code. — aegis, Nov 04 '16 at 06:14

score 1 · Answer 2 · answered Nov 04 '16 at 05:33

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>

is it work for you? or if you have any query let me know – Hetal Rupareliya Nov 04 '16 at 06:32 — Hetal Rupareliya, Nov 04 '16 at 06:32

Samir · Accepted Answer · 2016-11-04T05:36:09.700

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>

sir,i does not work for me,Shall i post complete source code of my project, it contains gridview also — Ram, Nov 04 '16 at 05:29
remove the, `return false` and try once. I have modified the answer. And please consider the second option, with `$(document).ready(function ()` @Ram — Samir, Nov 04 '16 at 05:37

can not show javascript popup table in ASP.net

3 Answers3