How to implement the html div tag in .js file.. is it possible?

Question

0.00/5 (No votes)

See more:

This is the JavaScript function that I'm calling:

JavaScript

<script type="text/javascript" language="javascript">
        function divConfirm(data) {
            document.getElementById('data').innerHTML=data;
            document.getElementById('divConfirmPrompt').style.visibility = "visible";
        }
 </script>

The below Div tag I'm using to display the Messagebox in the Webform:

ASP.NET

<div id="divConfirmPrompt" style= "position:absolute;z-index:1000; width:350px;height:150px;border: solid black 1px; padding: 10px;background-color:rgb(212,208,200);visibility:hidden;top:38%;left:41%;vertical-align:middle" align="center" >
         
         <span id="data"> </span>
        <asp:button runat="server" id="btnClsYes" text="OK" CssClass="button" style="margin-left :15px;margin-top:25px" onclick="btnClsYes_Click" />                
     </div>

I'm calling the above JavaScript function from CodeBehind:

C#

ScriptManager.RegisterStartupScript(this, typeof(Page), "OnClientClicking", "divConfirm('" + "Error message" + "');", true);

As of now I'm implementing the same JavaScript function and div tag in all the pages to display the Message box in ASP.NET Webform...rather I want to write the same JavaScript function and the div tag in one .js file and I want to take the reference of that page and to all other pages...is it possible? and may I know how to implement the div tag in .js file?

What I have tried:

I'm trying to display the below Div tag in .js:

ASP.NET

<div id="divConfirmPrompt" style= "position:absolute;z-index:1000; width:350px;height:150px;border: solid black 1px; padding: 10px;background-color:rgb(212,208,200);visibility:hidden;top:38%;left:41%;vertical-align:middle" align="center" >
         
         <span id="data"> </span>
        <asp:button runat="server" id="btnClsYes" text="OK" CssClass="button" style="margin-left :15px;margin-top:25px" onclick="btnClsYes_Click" />                
     </div>

Posted 3-Mar-16 23:27pm

JanardhanSharma

Updated 10-Mar-16 1:42am

FrostedSyntax

v7

Add a Solution

Comments

Wombaticus 4-Mar-16 6:16am

I'd suggest that instead of using "visibility" use "display":
In your div tag style use display:none;
In your js use document.getElementById('divConfirmPrompt').style.display='inline';
...might help.

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Rajesh Londhe · Accepted Answer · 2016-03-10T01:42:00

use your JavaScript as

JavaScript

function divConfirm(id,data) {
           document.getElementById(id).innerHTML=data;
           document.getElementById(id).style.visibility = "visible";
       }

where id is the id of div in which you want to display message. Now, just call this method from where you want by passing parameters like, id of div and data want to display.

How to implement the html div tag in .js file.. is it possible?

1 solution

Solution 1

Add your solution here

Preview 0

Existing Members

...or Join us