Javascript on user control

dacke87

In my jQuery DataTable I use asp custom user control and i added it like this:

          "columns": [   {
                "className": "dataTableActionColumn",
                "data": null,
                "defaultContent": '<uc1:PatientActionsAjaxControl runat='server' ID='ucPatientActionsAjaxControl' />'
            }]

ucPatientActionsAjaxControl has some buttons and it works fine until I added html tags for javascrpt.
<script type='text/javascript'></script>
I got a SyntaxError: unterminated string literal

I need javascript because bootstrap.js functionality doesn't work, so i wont to try to insert it on this user control.

$("[data-toggle=popover]").popover({
                    html: true,
                    content: function () {
                        return $('#someDiv').html();;
                    }
                });

This bootstrap code works when i click on button on page, but it doesn't work when I click on button in user control.

Any suggestion?

allan

This is not valid Javascript due to the quote marks:

'<uc1:PatientActionsAjaxControl runat='server' ID='ucPatientActionsAjaxControl' />'
  }]

You'd need to use:

'<uc1:PatientActionsAjaxControl runat=\'server\' ID=\'ucPatientActionsAjaxControl\' />'
  }]

Or change the outer set to double quotes.

Allan

dacke87

But it works fine with this. I have problem with adding <script type='text/javascript'></script> on user control. My user control look like:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="PatientActionsAjaxControl.ascx.cs" Inherits="ComtradeITSS.ZIS.GUI.Controls.PatientActionsAjaxControl" %>
<%@ Import Namespace="Resources" %>
<style type="text/css">
    /*table.dataTable tbody th div.ph-actions.btnRegular, table td.div.ph-actions.btnRegular {*/
</style>
<script type="text/javascript"></script> <!-- WITH THIS LINE IT HAS "SyntaxError: unterminated string literal", WITHOUT THIS LINE WORK PERFECT -->
<div id="phActions" class="ph-actions">
    <input type="button" id="lnkInPatientTransferAcceptance" onclick="activateOverlay(); activateLoader();openOtherPage(this);" class="btnRegular action-blue" runat="server" data-episodeofcare-status="11,7">
    <input type="button" id="lnkInPatientAdmission" name="lnkInPatientAdmission" onclick="activateOverlay(); activateLoader();openOtherPage(this);" class="btnRegular action-blue" runat="server" data-episodeofcare-status="5">
    <input type="button" id="lnkAdmission" onclick="activateOverlay(); activateLoader();openOtherPage(this);" class="btnRegular action-blue" runat="server" data-episodeofcare-status="1,2,4">
    <input type="button" id="lnkExamination" onclick="activateOverlay(); activateLoader();openOtherPage(this);" class="btnRegular action-blue" runat="server" data-episodeofcare-status="1,2">
    <input type="button" id="lnkAmbulanceDecursusDetermination" onclick="activateOverlay(); activateLoader();openOtherPage(this);" class="btnRegular action-blue" runat="server" data-episodeofcare-status="1,2,3,4">
    <input type="button" id="lnkInpatientExamination" onclick="activateOverlay(); activateLoader();openOtherPage(this);" class="btnRegular action-blue" runat="server" data-episodeofcare-status="6,8,9,10">
    <input type="button" id="lnkAnamnesis" onclick="activateOverlay(); activateLoader();openOtherPage(this);" class="btnRegular action-blue" runat="server" data-episodeofcare-status="1,2">
</div>
  

kthorngren

Did you fix the quote issue Allan mentioned above?

Kevin

dacke87

Yes, but in that case it doesn't work at all... "Parser Error Message: The server tag is not well formed."

kthorngren

Well, I guess without being able to see what's going on it will be difficult to help with just code snippets. Can you post a link to your page or provide a test case showing the issue.

Seems to me that you have a syntax error in your HTML. Maybe the W3C Validator to verify your syntax.

Kevin

dacke87

I don't know how to make custom user control with test case. Maybe you have solution why button click doesn't work on user control, but bootstrap.js is loaded and it works on .apsx page? (To open new topic for this question?)
This is loaded on document ready on aspx form...

$("[data-toggle=popover]").popover({
      html: true,
      content: function () {
      return $('#someDiv').html();;
  }
});

Thanks Dado

allan

Maybe you have solution why button click doesn't work on user control,

Very likely because there is not data-toggle=popover element on the page when that code is run. If the table's data is being ajax loaded, you'd need to run that code once the table has been drawn - drawCallback for example can help with this.

Allan

dacke87

I made it very simply. OnClick="SomeFunction()"

SomeFunction(){
$(this).popover({
      html: true,
      content: function () {
      return $('#someDiv').html();;
  }
});
}

Thanks