JavaScript

javascript doesn't work with FORM tag

1-May-12 4:15

Yes, I believe the following is somewhere in the core libraries.

JavaScript

function isJavaScriptEnabled()
{
     return new Date().getDay() == 0
}

There are only 10 types of people in the world, those who understand binary and those who don't.

williamroma29-Apr-12 9:21

williamroma

29-Apr-12 9:21

<b>(SORRY FOR MY BAD ENGLISH)</b>
hi i have a code , the javascript in the code is working perfectly , but when i surround the code with <form> </form> javascript stopped working , i tried to remove that <FORM> then javascript continue working ,
please help me how can i solve this problem ?
the code is
<pre lang="HTML">
<div id="addCell">
<fieldset>
<ul>
<li>
<label for="name">Name</label>
<input style="margin-left: 10px;"type="text" id="name" name="name"/>
</li>
<li>
<div id="places">
<label for="places">Places</label>
<input type="text" id="place0" name="place0"/>
<select id="addPlace" onchange="addPlace()">
<option>Select</option>
<option>Roma</option>
<option>italy</option>
<option>totti</option>
</select>
</div>
</li>
<li>
<input type="submit" id="saveAddCell" value="save"/>
</li>
</ul>
</fieldset>
</div>
</pre>

Richard MacCutchan29-Apr-12 23:06

Richard MacCutchan

29-Apr-12 23:06

williamroma wrote:
when i surround the code with <form> </form> javascript stopped working , i tried to remove that <FORM> then javascript continue working ,
please help me how can i solve this problem ?

What problem, and where is the Javascript?

Binding 100,000 items to a list box can be just silly regardless of what pattern you are following. Jeremy Likness

ZurdoDev30-Apr-12 9:18

30-Apr-12 9:18

JavaScript goes in the head tag and not in the form tag.

There are only 10 types of people in the world, those who understand binary and those who don't.

Peter_in_278030-Apr-12 18:18

Peter_in_2780

30-Apr-12 18:18

ryanb31 wrote:
JavaScript goes in the head tag and not in the form tag.

Not true! Try this in your favourite browser:

XML

<html>
<body>
<form>
<script type="text/javascript">
document.write("Hello World!");
alert("Told ya!");
</script>
</form>
</body>
</html>

Putting it in head might be good style, but it's not for function.

Cheers,
Peter

Software rusts. Simon Stephenson, ca 1994.

ZurdoDev1-May-12 1:55

1-May-12 1:55

True. However the OP said it does not work when put into the Form tag, so put it into the head tag.

There are only 10 types of people in the world, those who understand binary and those who don't.

williamroma2-May-12 1:43

williamroma

2-May-12 1:43

thanks for your replay
i don't mean that javascript doesn't work with me
no it words
but if i call any javascript function into a form tag , this doesn't work
i will explay
this works
<input type='button' onclick ='call1()/>
but this not worts Frown | :(

<form action="pp.php" method="post">
<input type='button' onclick ='call1()/>
</form>
please help me, thank you

Peter_in_27802-May-12 12:49

Peter_in_2780

2-May-12 12:49

There must be something else wrong. Buttons with javascript actions work just fine in forms.

Peter

Software rusts. Simon Stephenson, ca 1994.

BobJanova3-May-12 0:55

BobJanova

3-May-12 0:55

You are missing a quuote in your onclick there.

Javascript definitely works on form controls so you're doing something else wrong.

williamroma2-May-12 1:44

williamroma

2-May-12 1:44

and i don't want to put the javascipt in the same file with html , cos i have many many functions Frown | :(

Jquery Notification Navigation

Peter_in_27802-May-12 12:53

Peter_in_2780

2-May-12 12:53

In your html file, you can always write

HTML

<script type="text/javascript" src="myurl/myscript.js"></script>

That keeps your script in a separate file for ease of maintenance and reuse.

Peter

Software rusts. Simon Stephenson, ca 1994.

Billa223-Apr-12 16:31

Billa2

23-Apr-12 16:31

Hi ,

I have a jquery sticky notification in .aspx main page where it shows notification of expiry date and all based on userid now my requirement is to place a hyperlink inside this notification so that when user cliks it navigates to a ssrs report page.How i can place a hyperlink inside a jquery notification.The notification method which i used is from this following website for your reference:
http://thrivingkings.com/sticky/.Any One Please Help

Ragesh.

Re: Jquery Notification Navigation

ZurdoDev25-May-12 9:00

generated HTML calling javascript functions

25-May-12 9:00

Just add an href tag. Have you tried that? What exactly is the problem?

There are only 10 types of people in the world, those who understand binary and those who don't.

KingDidd20-Apr-12 8:01

KingDidd

20-Apr-12 8:01

I have been going nuts trying to figure out how to get a dynamically generated web page to call a javascript function.

It all started with Neeraj Saluja's nifty HTML bar charts.

I have a web page which calls a CGI perl script to generate a new page.

On that page is a button which calls the barchart() function.
The barchart() function in turn generates a Content string, which is then written to a new window, displaying the chart.

I'd like to have an active link in the chart, which when clicked will call a function for displaying additional information about the chart element being clicked.

If you've worked with those bar charts, and can help me figure out a way to define a function to be called when clicking on a link in the chart, I'd love to hear about it.

the CGI script generates a complete page, with its own ... sections. A function defined there generates the bar chart page, which needs its own section for defining the function I want to call by clicking in the chart, but that has to be embedded in the string already being written by CGI.

It's too ghastly for words.

Re: generated HTML calling javascript functions

Benaiah Mischenko24-Apr-12 23:26

Benaiah Mischenko

24-Apr-12 23:26

~~If I'm understanding you correctly, you could simply use an XmlHttpRequest to AJAX-load the generated page, then pluck out the chart using jQuery or something similar to stick it in your page.~~

~~Just a suggestion - I may be missing your problem entirely.~~

EDIT: Read over your question a few more times, realized I missed the point.

If these are really separate pages, then the only way to communicate between them without a refresh would be for the "show more info" page to use continual AJAX checks to a third file (on the server) that would be written to by the chart click (again, using AJAX) to notify the other page of the click. It's probably easier to bite the bullet and go with a refresh and regeneration of the info page on a chart click. Is that not an option?

Sorry for my first response, it was very stupid.

Comet hints

mehrdadc4817-Apr-12 21:11

mehrdadc48

17-Apr-12 21:11

I have a web site showing some data. It is constructed of:
- A web app, showing data.(ASP.Net app, but I don't use server side features in showing data; It's pure HTML and JavaScript)
- A Service providing data in Json format.(WCF)

the client requests data and receives and shows them.
Now I want to change the process in order to works in push base strategy.
I googled and I found out that that Comet is a good choice, but I don't found practical samples in my case.
Some samples had client with php (server-side) and so on.
Now I want some hints on using comet in a way that client is pure JavaScript and HTML and server is WCF (server pushes Json to JavaScript )

Best wishes

Code does't work on a MVC partial view rendering

Kenneth McCoy11-Apr-12 7:36

Kenneth McCoy

11-Apr-12 7:36

The following code works as intended when a page is loaded with the defined elements, but does not if it is to be called on a MVC partial view rendering. I understand why it doesn’t is because the page has already loaded but the elements this code acts on has not been loaded.

I have tried referencing the source of the code in partial view .ascx file and have also tried loading the code within script tags: these do not work.

Any help on how I can get this to work on a partial view/page update would be appreciated.

Sliding.js

JavaScript

// This is a reduced accordian effect on div class hideableItem elements.
$(document).ready(function () {
    $('.itemHeader').click(function () {
        // Get the parent of the item that was previously clicked.
        var priorSelectedParent = $('.itemHeaderSelected').parent().attr('id');
        $('#' + priorSelectedParent + ' .hideableItem').slideUp('fast');
        $('#' + priorSelectedParent + ' .itemHeaderSelected').addClass('itemHeader');
        $('#' + priorSelectedParent + ' .itemHeader').removeClass('itemHeaderSelected');
        // Get the parent of the item that was clicked.
        var headerParent = $(this).parent().attr('id');
        $('#' + headerParent + ' .hideableItem').slideDown('slow');
        $('#' + headerParent + ' .itemHeader').addClass('itemHeaderSelected cornersRoundSmall');
        $('#' + headerParent + ' .itemHeaderSelected').removeClass('itemHeader');
    })
});

// On pages that utilize the accordian effect this causes the div class openingHeader
// to open after the page loads.
$(document).ready(function () {
    $('.hideableItem').hide();
    // Needed to add a slight time delay before triggering the click event.
    setTimeout(function () {
        // Select the 'Summary' section be open after the page loads.
        $('.openingHeader').trigger('click');
    }, 10);
});

Thank you,

Ken

Re: Code does't work on a MVC partial view rendering

Kenneth McCoy12-Apr-12 6:46

Kenneth McCoy

12-Apr-12 6:46

Eureka! While I was hoping for a JavaScript answer to completely solve this problem (and would still appreciate one if possible) I did find a solution and wanted to share it so that others may benefit.

There were two issues in this problem: attaching click events to the itemHeader class elements and getting the hideableItem class elements to hide after the partial page update. The following is what had to be changed to correct the issues.

• I had to do away with $(document).ready event statements wrapping the two functions and name them.
• Use the on() method to attach a handler to the click event.
• Within the page calling the partial update I had to modify the Ajax.ActionLink method by adding an additional property, OnSuccess, to the AjaxOptions list. OnSuccess calls the javascript function hidingItems when the partial page update is successfully completed.

Here is the code with the corrections.

Sliding.js

JavaScript

// Event handler attachment that attachs the showItem handler to the click event.
$(document).on('click', '.itemHeader', showItem);

// Causes the previously unhidden hideableItem to hide and shows the current clicked item
// thereby providing the accordion effect.
function showItem() {
    // Get the parent of the item that was previously clicked.
    var priorSelectedParent = $('.itemHeaderSelected').parent().attr('id');
    $('#' + priorSelectedParent + ' .hideableItem').slideUp('slow');
    $('#' + priorSelectedParent + ' .itemHeaderSelected').addClass('itemHeader');
    $('#' + priorSelectedParent + ' .itemHeader').removeClass('itemHeaderSelected');
    // Get the parent of the item that was clicked.
    var headerParent = $(this).parent().attr('id');
    $('#' + headerParent + ' .hideableItem').slideDown('slow');
    $('#' + headerParent + ' .itemHeader').addClass('itemHeaderSelected cornersRoundSmall');
    $('#' + headerParent + ' .itemHeaderSelected').removeClass('itemHeader');
}

// On pages that utilize the accordion effect this causes the div class openingHeader
// to open after the page loads.
function hidingItems() {
    $('.hideableItem').hide();
    // Needed to add a slight time delay before triggering the click event.
    setTimeout(function () {
        // Select the 'Summary' section be open after the page loads.
        $('.openingHeader').trigger('click');
    }, 10);
}

Index.aspx

HTML

<li class="selectionItem"><%= Ajax.ActionLink("Background","Background", new AjaxOptions{UpdateTargetId="columnContent", OnSuccess="hidingItems"}) %></li>

Thank you to all of you who took your time looking into this problem for me. Cool | :cool:

Ken

how to detect upload dialog closing?

Ali Al Omairi(Abu AlHassan)9-Apr-12 4:58

Ali Al Omairi(Abu AlHassan)

9-Apr-12 4:58

guys;
As we know input type file uses a file dialog to let the user select the file to be uploaded. In most browsers the js code execution stops until the dialog is closed, but not in Safary and Opera.

I am wondering if there is a way to detect the dialog closing.

Help people,so poeple can help you.

Re: how to detect upload dialog closing?

Mohibur Rashid15-Apr-12 19:17

Mohibur Rashid

15-Apr-12 19:17

There is two even you should take a look
1. onchange
2. onselect

also read the link[^] for more info

Use getElementById without request to server

Christi50007-Apr-12 22:05

Christi5000

7-Apr-12 22:05

Dear guys,
I am just trying to inject some javascript code to a someone's web. I will then try to analyse the image obtained by getElementById.

However the image I got is every time different from what I see as I believe the image is dynamic, once I use getElementById, request is sent to server so getting new images.

I am a newbie to JS, can you please suggest how I can obtain the same image. say without requesting again, or any workaround like screencapture.

Thanks!

Ali Al Omairi(Abu AlHassan)

Ali Al Omairi(Abu AlHassan)8-Apr-12 3:11

8-Apr-12 3:11

Sir;
I don't think that getElementById() function requests the server. It searches the document for the given id and returns the specific element.

But, if you sent me your code, i can see it for you.

Help people,so poeple can help you.

Christi50008-Apr-12 6:12

Christi5000

8-Apr-12 6:12

Thanks for your reply!
Well I tried to inject the JS code to a web, all things worked fine except the dynamic image.

Some of the codes are:

<pre lang="cs">
var image = document.getElementsByTagName(&#39;img&#39;)[9];
alert(image.src);
//(Just to clarify again (image.src) is a thing like [http://random.com/random.jpg] which is purely random pic shown after every request.

var req =new XMLHttpRequest();
req.open(&amp;quot;GET&amp;quot;, image.src, true);
  req.onreadystatechange = function() {
      if (req.readyState == 4) {
        if (req.status == 200) {
var data =req.responseText;

//following try to append the same image but the result is different
var data_array = [];
    for (var i = 0; i &amp;lt; data.length; i++)
      {
        data_array.push(data[i].charCodeAt(0) &amp;amp; 0xff);
      }

for (var i = 0; i &amp;lt; 10; i++)
      {
 var o = document.body;
var div = document.createElement(&amp;quot;div&amp;quot;);
 div.innerHTML = data_array[i];
    o.appendChild(div);
}
        }
      }
    };
&lt;/pre&gt;</pre>

Ali Al Omairi(Abu AlHassan)

Ali Al Omairi(Abu AlHassan)9-Apr-12 2:39

9-Apr-12 2:39

Look, Sir;
The response come from the server cannot be fetch by XMLHttpRequest because its not XML based.

instead you can try this

var image = document.getElementsByTagName('img')[9];
alert(image.src);
//(Just to clarify again (image.src) is a thing like [http://random.com/random.jpg] which is purely random pic shown after every request.

var o = document.body;
var copy = document.createElement("img");
copy.src = image.src;
o.appendChild(copy);

Sir;
An image element presents an inner frame within the document that requests the server with its source (src) and fetch a response of type image.

Help people,so poeple can help you.