views:

150

answers:

2

Hi,

I have a problem with a master page containing a asp:textbox that I'm trying to access using jQuery. I have read lot sof thread regarding this and tried all the different approaches I have seen, but regardless, the end result end up as Undefined.

This is the relevant part of the MasterPage code:

<p><asp:Label ID="Label1" AssociatedControlID="osxinputfrom" runat="server">Navn</asp:Label><asp:TextBox CssClass="osxinputform" ID="osxinputfrom" runat="server"></asp:TextBox></p>

When I click the button, the following code from a jQuery .js file is run:

show: function(d) {
      $('#osx-modal-content .osxsubmitbutton').click(function (e) {
        e.preventDefault();
        if (OSX.validate()){                    
          $('#osx-modal-data').fadeOut(200);
          d.container.animate(
            {height:80},
            500,
            function () {
              $('#osx-modal-data').html("<h2>Sender...</h2>").fadeIn(250, function () {
                $.ajax({
                  type: "POST",
                  url: "Default.aspx/GetDate",
                  data: "{'from':'" + $("#osxinputfrom").val() + "','mailaddress':'" + $("#osxinputmail").val() + "','header':'Test3','message':'Test4'}",
                  contentType: "application/json; charset=utf-8",
                  dataType: "json",
                  success: function(msg) {
                    $('#osx-modal-data').fadeOut(200, function () {
                      $('#osx-modal-data').html('<h2>Meldingen er sendt!</h2>');
                      $('#osx-modal-data').fadeIn(200);
                    });
                  },
                  error: function(msg){
                    $('#osx-modal-data').fadeOut(200, function () {
                      $('#osx-modal-data').html('<h2>Feil oppstod ved sending av melding!</h2>');
                      $('#osx-modal-data').fadeIn(200);
                    });
                  }
                });
              });  
            }
          );
        }
        else{
          $('#osxinputstatus').fadeOut(250, function () {
            $('#osxinputstatus').html('<p id="osxinputstatus">' + OSX.message + '</a>');
            $('#osxinputstatus').fadeIn(250);
          });
        }           
      });  
    },

So the problem here is that $("#osxinputfrom").val() evaluated to Undefined. I understand that the masterpage will add some prefix to the ID, so I tried using the ID from the page when it's run that ends up as ct100_osxinputfrom, and I also tried some other hinds that I found while searching like $("#<%=osxinputfrom.ClientID%>"), but it ends up as Undefined in the method that is called from the jQuery ajax method anyway. The third and fourth parameters to the ajay function that is hardcoded as Test3 and Test4 comes fine in the C# backend method.

So my question is simply: How can I rewrite the jQuery selector to fetch the correct value from the textbox? (before I used master pages it worked fine by the way)

Best regards Daemon

A: 

You should use the attribute ends with selector

Link

it would be $("id$='osxinputfrom'")

Ben Robinson
I tried this also, and expected it to work, but it still give Undefined as the answer. Something I noticed now that is even stranger is that in the same jQuery function, inside the validation, I have the following line of code:var email = $('#osx-modal-data #ctl00_osxinputemail').val();This works fine, but inside the ajax part of the function, the same selector does not work.
Øyvind Bråthen
A: 

It will be abit slower but why dont you try adding cssclass="bla" to your label and then get it with $('.bla').val(); ?

XGreen