0

Can someone help me how to recognize or catch a custom web control with Jquery and access its client functions?

I created a Web Control(.ascx) in asp.net like in the example.

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="MyControl.ascx.cs" Inherits="MyControl" %>

<asp:Panel ID="myPanel" runat="server">
     <asp:TextBox ID="myText" runat="server" />
</asp:Panel>

<script type="text/javascript">
     function showMessage(){ 
          var txt = $('<%= this.myText.ClientID %>')
          alert(txt.val());
     }
</script>

Then, I want to place this control in a repeater in a web form (.aspx)

<table>
<asp:Repeater ID="myRepeater" runat="server">
<ItemTemplate>
 <tr>
 <td>
 <Pre:MyControl ID="myControl" runat="server" />
 <input type="button" id="myButton" onclient="sendData(this);" />
 </td>
 </tr>
</ItemTemplate>
</asp:Repeater>
</table>

In the same page, I want to manage my control of the current row where I click the button aside and here's my doubt.

In my function sendData I want to do something like this:

function sendData(sender){
 var row = $(sender).closest('tr');
 var ccontrol = row.find(*******) // 1. 
 ccontrol.showMessage(); // 2. 
}
  1. Here I want to catch my control with Jquery. I can find it by ID like row.find([id*='myControl']), but how can I recognize it as an object.
  2. Here I want to call the client function of the current control

EDIT: When I do this:

var ccontrol = row.find("[id*='myControl']");

I get this in the developer tools (debug)

<div id="myRepeater_myControl_4_myPanel_4">
    <div id="myRepeater_myControl_4_myPanel_4">
    <input name="myRepeater$ctl04$myControl$myText" type="text" value="hello world" id="myRepeater_myControl_4_myText_4">
</div>
 ,
<input name="myRepeater$ctl04$myControl$myText" type="text" value="hello world" id="myRepeater_myControl_4_myText_4">

I would be great to know how to get it as an object and have access to the showMessage().

When my control is rendered I can see in the view source that the repeater is showing my control in html and for each control the function showMessage individually. I want to encapsulate it.

2 Answers 2

0

Since i can not comment yet im writing it as an answer:
I don't know much about aspx templates, but try looking at MSDN
I'm guessing it should be something like onclientclick property instead of onclient so to reference to the click handler of the element.

0

You should be able to get whatever control you want using jQuery:

var yourControl = $("#yourcontrolid"); 

If you want it as an object just do the following:

var yourControlAsObject = $("#yourcontrolid")[0]; 

EDIT: Updated to answer comment.

EDIT #2:

Would it work better if you just included the script function once with an include for your usercontrol (yourusercontrol.js)? If you look at your HTML, isn't the showMessage definition showing up over and over?

You could change the showMessage function to look like:

function showMessage(controlID){ 
    var txt = $('#' + controlID);  // you didn't have the # in your example
    alert(txt.val());
}

Then in your sendData function:

function sendData(sender){
    var row = $(sender).closest('tr');
    var ccontrol = row.find(*******)  // 1.
    showMessage(ccontrol.attr('id')); // 2. 
}

Not sure if this is what you are actually looking for but maybe this approach will at least help get you going.

3
  • I don't understand your answer. I want to find my control with JQuery but as an object and as an object to get access the its client-side methods. Jul 3, 2015 at 22:32
  • Thanks for your answer. My previous update, it showed in the console of Dev tools my control as a simple text but adding the [0] it looks like "wrapped" but I still can't access to the javascript inside the control. I want to recognize my web control as object in order to access its client behavior. Jul 6, 2015 at 13:58
  • I don't see in your example how showMessage is tied specifically to your control? In the Repeater, the function script will just be duplicated for each row with a different client ID but the function itself will still be the same.
    – Kelsey
    Jul 6, 2015 at 14:22

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.