javascript unable to update linkbutton text after closing modalpopupextender

Hi everyone,

I am new to this forum. I am stuck with my codes and I will greatly appreciate if someone could help me out :)

What I am trying to achieve is this: 

I have a link button with the text value: <Enter the amount> and when I click on it, it will open the modalpopupextender. I will be able to input an amount and upon clicking the submit button, it will do validation checks. If it is a valid amount, I want it to update the link button.text to become the amount value, eg: 25.5 and display it in red.

<form id="form1" runat="server"><asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" EnablePageMethods="true"></asp:ToolkitScriptManager><asp:Panel ID="pnModelPopup" runat="server" CssClass="popup"><div style="margin-left:auto; margin-right:auto; text-align:center"><asp:Label ID="popUpHeader" runat="server" Text="Total Amount" Style="text-align:center" Font-Bold="true" Font-Size="X-Large"></asp:Label><br /><br /><br /><asp:TextBox ID="inputTotalWeight" runat="server" Height="200px" Width="450px" Font-Size="80" style="text-align:center" ForeColor="DarkBlue"></asp:TextBox><br /><br /><br /><asp:RequiredFieldValidator ID="rfv1" runat="server" ErrorMessage="Input an amount" Display="None" ControlToValidate="inputTotalWeight" ValidationGroup="checkAmount"></asp:RequiredFieldValidator><asp:ValidatorCalloutExtender ID="vce1" TargetControlID="rfv1" runat="server"></asp:ValidatorCalloutExtender><asp:RangeValidator ID="RangeValidator1" runat="server" ControlToValidate="inputTotalWeight" MinimumValue="0.00" MaximumValue="1000.000" Type="Double" ErrorMessage="Invalid Input, please try again!" ValidationGroup="checkAmount" ForeColor="Red"></asp:RangeValidator><br /><br /><asp:Button ID="btnSubmit" runat="server" Text="Submit" CausesValidation="true" ValidationGroup="checkAmount" OnClientClick="ValidateAndHidePopup()"/>&nbsp&nbsp&nbsp<asp:Button ID="btnCancel" runat="server" Text="Cancel"/></div></asp:Panel><asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server"
            BackgroundCssClass="modalBackground"
            PopupControlID="pnModelPopup"
            TargetControlID="lnkbtnSignin"
            CancelControlID="btnCancel"></asp:ModalPopupExtender>


//This is where I write the code for my linkbutton
<asp:LinkButton ID="lnkbtnSignin" runat="server" Text="&#60 Enter Total Amount >"></asp:LinkButton>


//My Javascript
<script type = "text/javascript">
        function HidePopup() {$find(ModalPopupExtender1).hide();

        }
        function ValidateAndHidePopup() {
            if (Page_ClientValidate('checkAmount')) {
                HidePopup();
                test();
            }
        }
        function test() {
            document.getElementById('testing').innerHTML = "testing: 25.50kg"
        }</script>

I am guessing it is because the window is still focusing on the popup and hence it does not work.

Any one can advice me on how should I go about this problem? Or any other better ways to achieve the outcome?

Thanks so much!