Need to call jQuery dialog (register user) on postback when non existing username is entered

Question

My ASP.NET form allows user to insert list of participants / friends with autocomplete. I want to prompt jQuery dialog form when user click submit and participant doesnt exist already in database.

I want the dialog to open only when non existing name / email is entered. I am not sure how to call it in that manner. Help?

Thank you!!!

Running IIS 6 + Framework 2

EDIT : this is the rough design.. I am passing the textbox value to validate function, evaluating weather its an email or name & check it against database

page_load
{
    check = validate_experiment(participant);
    if (check == validate.invalid_researcher)
    {
        //raise error & make flags visible
        return false;
    }
    insert_participant(...);
    // redirect
}

How do you know the guy does not exist yet ? Show the code you have so far... — Didier Ghys, Feb 10 '12 at 16:51

score 1 · Accepted Answer · answered Feb 10 '12 at 16:53

1

You will create a WebMethod in you aspx page, and post a ajax request, in success return you will open the dialog based in the return.

First the WebMethod:

[System.Web.Services.WebMethod] 
public static bool VerifyIfExists(string participantName) 
{ 
    return // Business to verify in the database and return if exists the participant; 
}

Your html:

<input type="text" id="participantName" />
<button type="button" onclick="VerifyIfExists()">Verify</button>

Your ajax post:

function VerifyIfExists()
{
    $.ajax({
        type: "GET",
        contentType: "application/json; charset=utf-8",
        url: "yourAspxPage.aspx/VerifyIfExists?participantName=" + $("#participantName").val(),
        success: function (participantExists) 
        {
             if (!participantExists)
             {
                 // open a dialog, alert, show a div, whatever you want
             }
        }  
    }); 
}

To see more robust exemple: http://www.codeproject.com/Articles/95525/ASP-NET-and-jQuery-to-the-Max

answered Feb 10 '12 at 16:53

Vinicius Ottoni

4,631
9
42
64

Ohh.. I am using IIS6 with framework 2. Unfortunately, Webmethods arent exactly at my disposal *sigh* – Bhrugesh Patel Feb 10 '12 at 17:00
The problem is with webmethods or json requests? Look: http://stackoverflow.com/questions/332988/get-iis6-to-serve-json-files-inc-post-get. – Vinicius Ottoni Feb 10 '12 at 17:10
Because if you see in this post he use webmethod in iis6: http://stackoverflow.com/questions/2225781/asp-net-web-method-that-accepts-a-listcustomobject-is-failing-with-web-servic – Vinicius Ottoni Feb 10 '12 at 17:14
And using with .net 2.0: http://msdn.microsoft.com/en-us/magazine/cc163725.aspx and http://www.dotnetbips.com/articles/464737e2-afcb-4f00-8df2-13f3436a66fa.aspx – Vinicius Ottoni Feb 10 '12 at 17:20
I have tried webmethod before for my autocomplete but it doesnt work in my environment. – Bhrugesh Patel Feb 10 '12 at 17:55
You saw the first link? Try it to configure your ii6 to accept json requests. – Vinicius Ottoni Feb 10 '12 at 17:58
tried all that first time.. I tried every single option I could find... oh well, thanks for the help. For now I would stick with a static button. I will see I can get a work around once I am done with all my key functionalities. – Bhrugesh Patel Feb 10 '12 at 18:09

score 0 · Answer 2 · answered Feb 10 '12 at 16:59

One solution you can do is check as the autocomplete fills out. This is some sample code for filling out my text field.

$("#search").autocomplete({
        source: function (request, response) {
            $.ajax({
                url: "MyWebService.asmx/FetchUsers",
                data: "{ 'search': '" + request.term + "' }",
                dataType: "json",
                type: "POST",
                contentType: "application/json; charset=utf-8",
                dataFilter: function (data) { return data; },
                success: function (data) {
                    response($.map(data.d, function (item) {
                        return {
                            value: item
                        }
                    }))
                },
                error: AjaxFailed
            });
        },
        minLength: 3
    });

So you can change the success to look like

success: function (data) {
                    if (data.d.length == 0)
                        alert('Does Not Exist');
                    else {
                        response($.map(data.d, function (item) {
                            return {
                                value: item
                            }
                        })) }
                }

If you want to do it as they hit the click button, you can create a button and tie a javascript function to the onClick event to do a post to a webservice and check if the value exists so it'd be something along the lines of this:

<asp:Button ID="Button1" runat="server" onclick="verifyFriendExists()"></asp:Button>
<script type="text/javascript">
    function verifyFriendExists() {
         var user = $('#userbox').value;
         $.ajax({
            type: "POST",
            url: "MyWebService.asmx/VerifyParticipant",
            data: "{'user': '" + user + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                if (msg.d != "Success")
                    alert('Does Not Exist');
            },
            error: AjaxFailed
        });
    }
</script>

And create a WebService with a method that's something like

[WebMethod]
public String VerifyParticipant(string user)
{
    bool userExists = CheckParticipant(user);
    if (userExists)
        return "Success";
    else
        return "Does Not Exist";
}

I know that's a lot to look over. Let me know if I wasn't clear on something. Good luck!

Once again, I am using IIS6 with framework 2. Unfortunately, Webmethods arent exactly at my disposal sigh .. makes me even more sad :( — Bhrugesh Patel, Feb 10 '12 at 17:02
Well here's a down and dirty way to force a message box from server side: `public void MsgBox(string message) { Response.Write(""); }` It doesn't function as nicely as a traditional javascript alert() but it does work. Then you can just check from the server side and call that function if the user doesn't exist. — Ben, Feb 10 '12 at 17:13
checking out with autocomplete? but autocomplete fires on each keypress. I need to pop up register user dialog form. I dont think it will be convenient for user if i pop up the form on each key press — Bhrugesh Patel, Feb 10 '12 at 18:02
I'm saying have the autocomplete fill out like normal. When they click their submit button, then check if the user exists with c# code and if you need to throw a pop up box, use the c# function I put up in the comments. With this method, you don't need to wire the button to a javascript function, just all your c# stuff. — Ben, Feb 10 '12 at 18:31

Need to call jQuery dialog (register user) on postback when non existing username is entered

2 Answers2