Converting an HTML Java script to work with ASP.Net C# - javascript

Good day everyone,
I have been tasked with recreating a page that was originally written in HTML, to aspx.
I have successfully recreated the page and added additional functionality, but the main thing is it's suppose to run a java script once the submit button is hit.
I have the provided java, but don't really understand how to get it to work with my page.
I'm not even sure where to put the java code to begin with. The other examples online I couldn't make sense to what im trying to do. Please help.
Took a screen shot since it cuts out a lot of my code for some reason.

You can bind the submit button to a event and run the code inside the script in it.
Something similar to this:
$("#[YOUR_SUBMIT_ID_BUTTON]").on('click', function(e) {
e.preventDefault();
//Your JavaScript Code
});

Related

Using node to bring in a javascript page

I made a website that has about 400 lines of javascript code, on the front end. I want to put it on the back end so that when people visit the web page that uses the javascript, and click the submit button, only then does the website go to the server and use the necessary JS code, however with all the tutorials ive read and watched i cannot find anything specific to this, can anyone please help? thanks in advance

javascript scratchblocks squarespace

I would like to use Scratchblocks (a tool for rendering visual Scratch code blocks from a text listing, on GitHub) on my Squarespace website. The problem I am getting is that the scratchblocks are never rendered on the first load - but only after a refresh.
This is in the header (set in the header for that particular blog):
<script src="https://scratchblocks.github.io/js/scratchblocks-v3.1-min.js""></script>
Then I think I need to call this function at the end of the page - I've put it in the footer:
scratchblocks.renderMatching('pre.blocks');
NOTE: When I view the source I sort of see this JavaScript twice at the end of the page. Not sure what is happening there.
Here's an example of it on my website, where it renders the scratchblocks only after a refresh. [UPDATE - following the fix provided below, this now renders first time, every time as far as I can tell.]
[http://www.glennbroadway.com/coding-zone/2017/4/6/simple-collisions-in-scratch]2
Here's an example of someone else using it and it working properly. I've inspected the source and I can't work out how they are doing it.
https://codeclubprojects.org/en-GB/scratch/memory/
I've also tried all the different methods listed elsewhere on stackoverflow for getting javascript to load only after the HTML has finished. I can't get any of them to work - but I think the problem is something to do with Squarespace, I just don't have the knowledge to work out what.
Any help would be greatly appreciated.
In Squarespace, when your custom Javascript only works after a page refresh, it most likely has to do with Squarespace's AJAX loading:
Occasionally, Ajax may conflict with embedded custom code or anchor
links. Ajax can also interfere with site analytics, logging hits on
the first page only.
You may be able to disable AJAX for your template. Or, see the other approaches outlined here: https://stackoverflow.com/a/42604055/5338581 including:
window.addEventListener("mercury:load", function(){
// do stuff
});
In addition, I would generally recommend placing custom code in the "Footer" code injection area unless you have a specific reason to do otherwise.

Embedded calendar stopped working

I am responsible for maintaining 2 websites. One is a Wordpress website that is just a list of events using Time.ly's All in One Event Calendar plugin. The other is a conventional built from scratch website using html.
The html website has had code that embedded the Wordpress calendar feed into it for several years, and it's always worked fine and I haven't had to do anything with it. Recently, it just stopped working. The calendar feed is just gone with no errors returned, no problems loading the site or anything. It looks as if somebody just deleted the code for it. However, the code is still there and is as follows:
<script class="ai1ec-widget-placeholder" data-widget="ai1ec_superwidget" data-action="stream" data-tag_ids="45">
(function(){var d=document,s=d.createElement('script'),
i='ai1ec-script';if(d.getElementById(i))return;s.async=1;
s.id=i;s.src='http://www.texascitycommunitycalendar.com/?ai1ec_js_widget';
d.getElementsByTagName('head')[0].appendChild(s);})();
</script>
Can anybody identify any obvious reason that that might have just stopped working?
I don't see a reason for that very last () pair in the script tag (just before the semicolon that is followed by the closing </script>tag. Try to erase it.

How to highlight (un)used JavaScript live in Dreamweaver

I am working in Dreamweaver CS4 and implemented JQuery code that I found online for a gallery function.
I am only using a very small part of the gallery functions available, and would like to delete the unused script in order to get more clarity and a cleaner script. But as a JavaScript beginner I can't identify what is important and what is not.
My question: Is there a way in Dreamweaver to view/highlight the JS code that the site is using? I am imagining a tool that you could turn on when running the live view that would visualize the portions of code that is being used.
Or, the other way round, is there a way to highlight the unused code.
The live code button doesn't seem to do this.
Thanks for your help!
My question: Is there a way in Dreamweaver to view/highlight the JS code that the site is using?
No. You would need to use Firebug or a similar javascript tracker/debugger to see how the code is used. The most DW will tell you is which external files are linked to a page.

DOM based scripting

ok so here's my problem...
i've been following this tutorial ( http://www.alistapart.com/articles/dropdowns )
to make a css drop down menu with my wordpress blog. everything works fine... except in IE6.
now i know this is normal, and in the link i posted above there is a fix of this which makes use of DOM based scripting... is this java script?
the main question i have is.. where do i paste this code into? css, html, make a new file?
i'm new to any form of javascript.. it's boggling me a bit..
any help would be great!
Thanks!
yours truly
noobie
Yes, it is JavaScript.
As such, you can place it in a <script> block, preferrably inside <head>. (It assigns itself to window.onload, so the code will be executed at onload, no matter where in the page you put the code)
the main question i have is.. where do i paste this code into? css, html, make a new file?
I suggest you take a look at the source of this sample page:
http://www.htmldog.com/articles/suckerfish/bones/. It shows the bare details of how it's implemented.
i'm new to any form of javascript.. it's boggling me a bit..
I would like to suggest you read this nice tutorial which already helped out numerous developers during the years: w3schools.com/js.
Grz, Kris.

Categories