converting a click function to call function

Question

I know this topic is asked before but they were not about jqueryui. Therefore I couldn't be sure will they work on my code. I have a pop up that is called from different components. But I have to write a click function for each call. I want to convert it to ca function that I can call it. My script is:

 <script type="text/javascript">
        $(document).ready(function () {
            $('a#popup').live('click', function (e) {

                var page = $(this).attr("href")

                var $dialog = $('<div id="silmeIframe"></div>')
                .html('<iframe  style="border: 0px; " src="' + page + '" width="500px" height="500px"></iframe>')
                .dialog({
                    autoOpen: false,
                    modal: true,
                    height: 'auto',
                    resizable: 'false',
                    width: 'auto',
                    title: "Silmeyi onaylıyor musunuz?",
                    close: function (event, ui) {

                        __doPostBack('<%= btnRefresh.ClientID %>', '');
                    }
                });
                $dialog.dialog('open');
                e.preventDefault();

            });

        });
    </script>

Now, I want it work like

<a onclick="NewFunctionName(parameter1,parameter2,,parameter3)">click<a/>

i don't get what's wrong with this one. why do you create handlers for each? jQuery can attach a single handler to multiple elements. — Joseph
– Joseph, Commented Apr 24, 2012 at 0:56
@Joseph there is nothing wrong, he just want to transform it — ajax333221
– ajax333221, Commented Apr 24, 2012 at 0:59

Joseph · Accepted Answer · 2012-04-24 07:25:00Z

1

single handler, multiple targets attachment

$(function () {

    function handler(e,param1,param2...) {
        var page = $(this).attr("href")
        ...
        $dialog.dialog('open');
        e.preventDefault();
    }

    //write attachments
    $('a#popup1').on('click',function(e){
        handler(e,param1,param2...);
    });
    $('a#popup2').on('click',function(e){
        handler(e,param1,param2...);
    });
    $('a#popup3').on('click',function(e){
        handler(e,param1,param2...);
    });
});

or single handler, multiple targets in one query

$(function () {
    $('a#popup1, a#popup2, a#popup3').on('click',function (e) {
        var page = $(this).attr("href")
        ...
        $dialog.dialog('open');
        e.preventDefault();
    });
});

edited Apr 24, 2012 at 7:25

answered Apr 24, 2012 at 1:11

Joseph

120k31 gold badges186 silver badges238 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

osmanraifgunes Over a year ago

Thanks for your answer. I have tried it. But I dont know how use handler in the first method. Do I have to write just like you wirte. Or inside the <a> tag?

Joseph Over a year ago

@user1352563 just the way it is. you target the <a> when you attach (the parts with a#popup). you should avoid inline JavaScript in elements.

osmanraifgunes Over a year ago

I have wrote it like that but it doesn't work. It opens the <a> tag href link on a new page. But it should be opened as a pop up. That is , I think, it does not see the popup id.

Joseph Over a year ago

@user1352563 did you include an e.preventDefault(); or return false at the end of your handler code? what does the console say? did you target the <a> properly?

osmanraifgunes Over a year ago

I have deleted }); at last part because it gives syntax error. After that I tried putting document ready at the top of the script. Both of them did not work. And then I tried by deleting e.preventDefault();. there is no return false already.

|

Collectives™ on Stack Overflow

converting a click function to call function

1 Answer 1

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related