First time writing Javascript properly [closed] - javascript

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 9 years ago.
Improve this question
I've been writing Javascript with jQuery for a while, I can make it do what I want, but I've never written anything really reusable or modular. Now it's time for me to take that step and write proper reusable Javascript.
I thought I'd start with something I've implemented countless times, a confirm delete dialog. I want to be able to specify a function to execute on confirm and a function to execute on cancel.
The way I see this working (and this is open to criticism) is to do something like:
$(element).confirmDialog(function(){
// this is the cancel callback
},
function(){
// this is the confirm callback
});
I'd also like the dialog to show based on a data attribute on the link, rather than having to write an .on('click'... handler each time, but I don't know how to 'link' the specific confirmDialog with the function which handles the .on('click'....
This is really as far as I've got so far. I know that as I want to be able to add the functionality to any element I need to define confirmDialog() as $.fn.confirmDialog = function(){...}.
Although I can implement the entire thing in an ad-hoc way, I'm unsure as to how to implement this functionality as a clearly defined, loosely coupled reusable module.
Could someone help me get my head around how to structure this module, or provide a link to a very thorough tutorial which is specifically about writing reusable Javascript?

You can read more about how to create jQuery plugins at the following links:
http://learn.jquery.com/plugins/basic-plugin-creation/
http://www.codeproject.com/Articles/291290/How-To-Write-Plugin-in-jQuery
NetTuts videos are particularly useful:
http://net.tutsplus.com/articles/news/learn-how-to-create-a-jquery-plugin/

Related

Should I use Jquery to click toggle instead of React? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 3 years ago.
Improve this question
I often heard that it is bad idea to combine react and jquery but I think it is more easier for me to make change on DOM with jQuery
Example:
<a className="toggleLink">Click Here to toggle Menu</li>
<div className="contentToToggle">content to toggle</div>
For jquery, I will write to function extend then I can use again for many cases or I can use click event directly by class. This class will also used again.
jQuery.fn.extend({
toggle: function(element){...}
});
but in react, I feel quite complex, each click on each component, I have to make a state to return for that component only.
Expose that I have 10 click events: First to toggle, second to addClass, third for showing popup...
So it should be bad idea to use React in this case. Is it right?
I want someone here can help me with this situation. Thanks
It is always preferred to not mix React and JQuery and it might make things more complicated.
Both of them have different ideologies. JQuery modifies actual DOM whereas React plays around with Virtual DOM.
Coding things with React may seem little bit heavy and cumbersome initially but it keeps things much more clear and less abstract going forward. Hope this helps !
No no no no no and some more no 😉😂
They are two different approaches to building a web app. Using JQuery means React could no longer be handling state, events and UI rendering. Which can causes conflicts, almost like two builders trying to build the same road at the same time using different materials and approaches.
If you using React you should use React's approach to manipulating and updating the DOM. That being said you don't have to use React if you don't want to. If you're familiar with JQuery build the site the way you know how if that will get it done quicker and React is not a requirement.

Opening onclick events python requests library [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 4 years ago.
Improve this question
Tried to get links to all issues of a publication for a given year, from this link: http://www.vetsci.org/journal/list.html?pn=vol&year=2018.
E.g: "Jan. Vol. 19 No.1. 1~160", which has an 'onclick' event.
edited
I would appreciate any help with how to do the following:
first, activate the onclick event;
second, get the link of the page to which the onclick event is leading the browser -> I have used the developer tools after clicking, to see the link of the new page. However, since this is no different to manually clicking and copy/pasting the url, I would like to know if there is a way to automatically read these links.
edited
Hope I am not spamming, since there are a couple of other threads on issues with getting popups and similar, but those seem like somewhat advanced stuff - at least from where I am standing :)
If you want to activate the event itself in any situation, you'll need something like Selenium. If you want to retrieve the page in the example you gave, inspection of the code shows that the onClick event loads the list.html page with parameters like so:
http://www.vetsci.org/journal/list.html?s_v={volume}&s_n={number}&sort=start_Page*1&TG=&pn=vol&year=2018&sm={4th argument}
I can't quite tell what the 4th argument is supposed to be because it's blank in all the examples you gave. If you do a GET request on that URL, you can use something like BeautifulSoup to parse the page.

javascript guidance re arranging functions into files [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 9 years ago.
Improve this question
Have written a large system in ColdFusion/Javascript/MySQL. There is lots of Javascript. The few functions which are long are separated into cases. Currently I have all the js in 3 files, depending on the section of the application to which they refer.
Every now and again, some function which tested okay before turns out not to be working (I might have changed something elsewhere to cause that problem, without realizing I had to retest).
Okay, I deserve that, but when one js function in the file stops working, sometimes others do as well. So unexpectedly something I was counting on to validate things, or prevent a submit in the presence of errors does not work.
I've thought of breaking up the js so that any javascript function which is used by just one program will be resident there, and I would use the files with several js functions only for those that several programs have to access. That would insulate my functions somewhat from problems occurring elsewhere.
Is this approach recommended? Could someone offer good reasons for or against it? Or is there a way to "firewall" my functions so that problems with one do not spill over into another?
I'm feeling that the js is a weak link in my system -- that I can't trust it; yet I need it, so I have to find a way to make things more stable. Any and all suggestions to help would be much appreciated.
The suggestion "get better at Javascript" has already occurred to me. I am trying. Meanwhile, my needs are not very demanding. All my functions do simple things and are written in a pretty straightforward way. Yet I am having all this trouble.

Can someone explain Javascript Asynchronous Callbacks? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 9 years ago.
Improve this question
I'm rather new to Javascript and some of the syntax is not very clear to me. I've usually copied example code from the internet when I needed it, but I would like to understand it better.
Can someone explain, in simple terms, how javascript knows to call the function supplied, and how it knows to do it asynchronously? Is there something that tells it do do this, or is it just built into the language?
Thanks
Whenever you want to something when something happens (and that something is outside the control of JavaScript (e.g. "When the user clicks on a button" or "When the HTTP response is received from the network".)) you typically use an Event Listener.
This is a function that you tell JavaScript to run when the event happens.
They are typically set up by using the addEventListener method or by assigning a function to a property with a predefined name on the right kind of object.
When the event happens some code (typically (in a browser this is almost always) provided by the underlying environment) will check to see if any appropriate event listener functions exist and executes them.

How to code a given jquery into a javascript? [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
I am new to phonegap.So,using JAVASCRIPT for the first time.I am working in javascript. I am comfortable working with Java Script. I am implementing a plugin for SMS in Phone Gap.
In the tutorial they have asked to use the following code.
window.plugins.sms.send($('#phone').val(),
$('#message').val(),
function () {
alert('Message sent successfully');
},
function (e) {
alert('Message Failed:' + e);
}
);
Could some one help me out in de-coding the jquery code?
please help me out.
You can use document.getElementById('phone').value instead of $('#phone').val() to get element's value without jquery.
It looks like that function window.plugins.sms.send takes a phone number, a message to send, a function to run on success, and a function to run on failure. What that code is doing is providing the first 2 of those 4 things using jQuery selectors, and the last 2 as anonymous functions.
Have a look at http://jquery.com/ (yes, just the homepage) and scroll down to the "A Brief Look" section. That will give you an idea of what the code you provided is doing.
Basically, the tricky bit to get your head around is that $ in there.
The $ in jQuery is just the function that instantiates jQuery. Anything in the parentheses immediately after it is a selector, and then everything after that are methods to call on the object returned by the selector.
The code you provided is looking through the DOM for an element called phone and an element called message. The # in front of those means to match only one, unique element. jQuery selectors can also be used to select groups of elements and operate on them all at once.
I'd really recommend going through the jQuery tutorials as they are quite quick to get through. If you already know javascript you'll have little problem getting your head around it.

Categories