modalpopupextender and commas appearing in my textbox asp.net

Question

Some weird stuff is happening, I am converting an application that used to use javascript to open another web page in a tiny window for data input to use a ModalPopupExtende

Answer 1

My answer was similar to Smarty's. My page looked like this...

<UpdatePanel>
    <GridView>
        <Button> <-- These buttons fire modal popup programmatically.
        <Button>
        <Button>
    </GridView>
    <ModalPopup>
    <HiddenField> <-- Dummy target of modal popup.
</UpdatePanel>

The fix was to change it to this...

<UpdatePanel>
    <GridView>
        <Button> <-- These buttons fire modal popup programmatically.
        <Button>
        <Button>
    </GridView>
</UpdatePanel>
<ModalPopup>
<HiddenField> <-- Dummy target of modal popup.

I had to register each button as a postback control with the scriptmanager on the gridview rowdatabound event. The down side is that I have more full postbacks. But, it solved the problem.

Answer 2

has same problem and i found the solution here: http://ajaxcontroltoolkit.codeplex.com/workitem/26259

The problem is ajax last version, just INSTALL year 2009 ajax version and modalpopup will work fine with your actual code.

Tuve el mismo problema y encontré la solución en el link que indico arriba. El problema viene con las versiones recientes de ajax, simplemente instala la version del año 2009 y el modalpopup funcionará bien con tu código actual.

Answer 3

I have been trying to solve this for a day now and some very helpful person in my office has come up with a terrific solution!

We moved the ModalPopUpExtender and subsequent pop up panel controlled by the extender to ouside of the outermost UpdatePanel on the page, created a fake button and gave the ID of the fake button to the TargetControlID property of the ModalPopUpExtender.

<asp:Button runat="server" ID="dummyButton" CausesValidation="false" Style="display: none" />

<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="dummyButton" CancelControlID="CancelPopUp" PopupControlID="PanelID" BackgroundCssClass="modalBackground" />

Inside my forms/page where the PopUp extender and panels used to be, I created an OnClick event on the button that we used to use to trigger the ModalPopUpExtender.

<asp:ImageButton ID="ButtonID" runat="server" Text="Add" ImageUrl="~/Images/Add-32-1-small.png" OnClick="LoadPopUp" />

On my button that triggers the ModalPopUpExtender, I have created an OnClick event called "LoadPopUp" - in LoadPopUp in the code behind I simply put ModalPopUpExtender1.Show();

protected void LoadPopUp(object sender, EventArgs e)
{
  ModalPopupExtender1.Show();
}

Answer 4

I had the same problem except I am not using the AjaxControlToolkit or update panels. My problem was solved by moving the <form> tag from the ASP.net master page to the page where the textboxes are. May help someone.

Answer 5

The solution is to get the modal popup out of the main update panel. Once Do that the commas will go away. If you truly need an update panel inside of the modal popup, create one of it's own inside that panel.

Answer 6

For some reason it doesn't seem to happen if the textbox is set to ReadOnly.

I'm thinking there could be a workaround by displaying an editable textbox to the user, catching the keystrokes to it, and updating a readonly textbox that is hidden from the user.

Still a bit messy, but I can't roll back to May's release because there's another bug in that release with the ComboBox that I need to avoid!

---

UPDATE:

As a bit of background, I have a user control (ascx) inside my modal popup because I need to reuse it. The ascx has to handle the user's input itself (the containing page doesn't know what's going on inside the control) so when the user clicks a button I do a callback and process the data. If a successful result is returned to the client callback function then I simulate a click of what the containing page thinks is the "OK" button which is actually invisible to the user.

I've changed my code to add a hidden, readonly textbox and copy the text from the original textbox into the new one every time the text changes.

    <asp:TextBox runat="server" ID="txtName"></asp:TextBox>

becomes

    <asp:TextBox runat="server" ID="txtName" onchange="document.getElementById(this.id + 'RO').value = this.value"></asp:TextBox>
    <asp:TextBox runat="server" ID="txtNameRO" ReadOnly="true" style="display:none;"></asp:TextBox>

then when passing values back in the callback instead of getting the value of txtName, I use txtNameRO.

I don't think this will help if you're doing a postback, but you could add a callback before the postback like I have. Hopefully this will help someone anyway!