|
You can do a generic handler like this (assuming jquery):code:
IT BEGINS posted:I also allow the user to type in a customer name manually, and update the checkboxes if he has typed a valid name. Not sure what you mean by this part. Fish Ladder Theory fucked around with this message at 08:27 on Nov 15, 2014 |
# ? Nov 15, 2014 07:20 |
|
|
# ? Jun 5, 2024 08:18 |
|
Hey dudes, running into a display problem with JS and Gmaps. The text should look like the top popup, not the bottom one. Ie no scrollbar and all displayed. 80% of the time it does, but sometimes it looks like the bottom. JavaScript code:
Dominoes fucked around with this message at 11:46 on Nov 15, 2014 |
# ? Nov 15, 2014 11:26 |
|
Maybe set maxWindow to be slightly bigger than what maps thinks it needs to be?
|
# ? Nov 15, 2014 12:26 |
|
Dominoes posted:Hey dudes, running into a display problem with JS and Gmaps. I think that is a known problem, try the workaround in this: http://stackoverflow.com/questions/19954893/google-map-infowindow-displays-scroll-bars-in-google-chrome
|
# ? Nov 15, 2014 13:41 |
|
Fish Ladder Theory posted:Not sure what you mean by this part. Basically if I have three checkboxes with values 'A', 'B', and 'C', then when the user types 'A, B' into the input box, I'd like to check the corresponding checkboxes. I guess I can't get away from declaring a bunch of click handlers, though.
|
# ? Nov 15, 2014 14:27 |
|
you only need one click handler-- a generic one on any :checkbox It's a fun exercise so I went ahead and made a mockup here, including auto checking when you type in a name: http://jsfiddle.net/vyvf3a2e/4/ Only thing I didn't do is automatically uncheck a box when the user deletes a name manually
|
# ? Nov 15, 2014 21:22 |
|
IT BEGINS posted:This is maybe a more vague best-practices related question, but I'm having some trouble organizing my code for a particular feature. I have an input text box that a user can fill in that's also controlled by a list on checkboxes/customer names. The functionality I have is that when the user clicks on a checkbox/customer name, that value is added to the input box - multiple customers can be selected, with commas as a delimiter. I also allow the user to type in a customer name manually, and update the checkboxes if he has typed a valid name. Why would you need all those lines that do exactly the same thing? Assuming you can identify all the checkboxes with a single class, you just need $('.checkboxclass').on('click', function append checkbox label to whatever) to have it work for every one of them.
|
# ? Nov 15, 2014 23:15 |
|
spatula posted:Why would you need all those lines that do exactly the same thing? Assuming you can identify all the checkboxes with a single class, you just need $('.checkboxclass').on('click', function append checkbox label to whatever) to have it work for every one of them. Good point. The reason I thought I would have to have multiple handlers is because I have 4-5 controls that all function this similar way but work with different models. However, I can definitely still just create one handler that binds all of them and uses some other attribute to determine which model to hook up to. Thanks for the all the help guys!
|
# ? Nov 16, 2014 03:50 |
|
Edit, far too slow, anywayIT BEGINS posted:This is maybe a more vague best-practices related question, but I'm having some trouble organizing my code for a particular feature. I have an input text box that a user can fill in that's also controlled by a list on checkboxes/customer names. The functionality I have is that when the user clicks on a checkbox/customer name, that value is added to the input box - multiple customers can be selected, with commas as a delimiter. I also allow the user to type in a customer name manually, and update the checkboxes if he has typed a valid name. You have 2 [groups of] inputs, if that (you could just have one on the checkboxes but), so only really need 2 handlers, which should make it easier to reason the interconnected logic bit afterwards. You can ascertain what the user has input from each of those handlers - look at http://learn.jquery.com/events/event-delegation Pull all the names out into an array to check against. Then maybe write two overall handler functions. 1. is the check box checked? if not, take the name and add it to the text box, and apply checked. 2. has the user entered text (keyup and very open to issues unless you have some kind of 'add' button) & what's the latest thing written? split on commas, take the last array item, and check if it's in the names array - if so, check the relevant check box. You can further split this down into smaller, reusable functions, and just pass those as values. There are other ways to do it, but hopefully that gives you an idea RobertKerans fucked around with this message at 16:06 on Nov 17, 2014 |
# ? Nov 17, 2014 16:03 |
|
Wheany posted:I think that is a known problem, try the workaround in this: http://stackoverflow.com/questions/19954893/google-map-infowindow-displays-scroll-bars-in-google-chrome
|
# ? Nov 17, 2014 19:39 |
|
I really hate coming up with meaningful variable names
|
# ? Nov 18, 2014 23:36 |
|
Raskolnikov2089 posted:I really hate coming up with meaningful variable names
|
# ? Nov 18, 2014 23:38 |
|
Raskolnikov2089 posted:I really hate coming up with meaningful variable names 2 hardest problems in computer science: naming things, and cache invalidation.
|
# ? Nov 19, 2014 04:48 |
|
Subjunctive posted:2 hardest problems in computer science: naming things, cache invalidation, and off-by-one errors
|
# ? Nov 19, 2014 05:38 |
|
Alright, that was pretty good.
|
# ? Nov 20, 2014 19:13 |
|
Is there a good way for a JS file to read its own URL/query string? As in, if I load a file from "dick.butt/javascript.js?id=foo", can javascript.js somehow detect ID? The best way I've found so far is something like this, where a script finds the element that loads it and parses its own src attribute. If there's a better solution to the problem on that page, I'd like to hear about it, otherwise here's a solution for anybody else with the same problem.
|
# ? Nov 21, 2014 00:42 |
|
You could use RequireJS/another AMD loader to load the script, and then initialize the module with some parameters. Edit: see this SO question: http://stackoverflow.com/questions/10319027/requirejs-pass-parameters-into-module-for-initialization From the answer there, do this: code:
code:
DimpledChad fucked around with this message at 00:55 on Nov 21, 2014 |
# ? Nov 21, 2014 00:49 |
|
I suppose the best way would be to use additional infrastructure. I'll go with the find script element/parse query string method. The real problem I have right now is minimizing the amount of work necessary to load my file, so replacing that initial var id = "foo" with require.js really doesn't save me anything. Good solution, but not for me.
|
# ? Nov 21, 2014 08:11 |
|
Kind of a n00b question. What is the best practice for waiting for the DOM to load before running your scripts? 1. Is it common to just wrap all of your scripts in window.onload? Do people spend the trouble of only doing this if necessary? 2. I'm making some ajax calls that take some pre-existing divs and modify the innerHTML as well as some other functions that might modify the DOM, and event listeners. I'm not getting any errors, but it's a simple project so far. Do I need to wrap this in window.onload?
|
# ? Nov 23, 2014 08:00 |
|
Storgar posted:Kind of a n00b question. What is the best practice for waiting for the DOM to load before running your scripts? Are you using jQuery? Use $(function(){}). If not, use window.addEventListener('DOMContentLoaded', function () {}). You should probably use jQuery or some other library anyway.
|
# ? Nov 23, 2014 09:23 |
|
Uhhhhhhh no. I'm messing around with a personal project to learn Javascript and I'd figure I should learn what's "vanilla" javascript. If you have reasons for me to use jQuery, please tell.
|
# ? Nov 24, 2014 00:41 |
|
Because if you're doing it in a web page, you're learning "JavaScript for the web", which means you might as well simplify the web-centric stuff like window.onload by using jQuery to initialise your scripts. If you're not doing "JavaScript for the web" then why do you even care about how your scripts get executed? Use jQuery. Second to that, if you're just trying to learn JavaScript you could as easily go mess about in NodeJS and you won't have to battle with browser specifics. Learning JavaScript isn't really about learning it as a language these days, it tends to also come with a lot of necessary framework knowledge (like one of jQuery, knockout, or various node libs) because by itself it's not good for much, besides making you angry at the world. Anyone who did webdev before 2006 can attest to this. Storgar posted:1. Is it common to just wrap all of your scripts in window.onload? Do people spend the trouble of only doing this if necessary? You don't need to wrap absolutely everything, it's not like a class definition or anything. This is just the entry point for the script execution. This is usually done because if you want to do anything with the DOM, you need the DOM to be fully loaded. If you just write code in the <script> tag, then it'll execute as soon as that tag is loaded, and half your document might not be ready. Example: code:
code:
Storgar posted:2. I'm making some ajax calls that take some pre-existing divs and modify the innerHTML as well as some other functions that might modify the DOM, and event listeners. I'm not getting any errors, but it's a simple project so far. Do I need to wrap this in window.onload? You don't need to wrap the whole thing. Generally people will write a class-type thing and then execute an initaliser once the DOM is ready. By the way, there's a bazillion ways to do this, don't take this as the be-all recommended approach, but here's an example: code:
|
# ? Nov 24, 2014 04:07 |
|
Wow, great response! I guess its not too early to start using jQuery. Storgar fucked around with this message at 04:44 on Nov 24, 2014 |
# ? Nov 24, 2014 04:40 |
|
Storgar posted:Wow, great response! I guess its not too early to start using jQuery. If you're not worrying about older browsers you can skip jquery just fine. It does add some convenience (for example, adding event listeners to a bunch of elements matching a similar selector), but its definitely not necessary.
|
# ? Nov 24, 2014 04:54 |
|
Here's a cool website that shows a lot of common Jquery stuff next to how it's done in pure JS. Good reading. http://youmightnotneedjquery.com/
|
# ? Nov 24, 2014 04:58 |
|
Be aware that jquery's default mode of operation is to fail silently. If you get an element using $(".thing") and then bind an event to it, things work, however if it finds nothing, you get no clear and immediate error. Jquery is super permissive and meant to pave over mistakes and just finish its runtime without too many errors. Sometimes that's what you want, but for me I often prefer the native DOM API because it blows up with a clear error when my assumptions are off.
|
# ? Nov 24, 2014 09:06 |
|
Storgar posted:Wow, great response! I guess its not too early to start using jQuery. jQuery is less verbose than vanilla javascript. One other library that I like a lot is underscore (or lodash), but they fill a different purpose.
|
# ? Nov 24, 2014 09:08 |
|
spatula posted:Here's a cool website that shows a lot of common Jquery stuff next to how it's done in pure JS. Good reading. The little slider only goes back to IE 8 Yeah, that's plenty good for a lot of people, but still.
|
# ? Nov 24, 2014 18:54 |
|
I suppose it's implicit that if you need to support IE7 you probably do need jQuery.
|
# ? Nov 24, 2014 19:04 |
|
Require.js is bizarre and I just cannot wrap my head around it. I have a Yeoman-generated app that's based on a React UI, and I just cannot figure out how I'm supposed to add Backbone to the dependencies and be able to use it. I ran bower install backbone --save then grunt bower just like the Yo docs tell me to do, and it says that it "Updated RequireJS config with installed Bower components" , but Backbone is never actually loaded and the config doesn't actually change! Require.js has been such a pain in the rear end to wrangle that I'm really regretting using it for my project. Can anyone tell me how to get this frickin' thing to work? If it helps, here's my main.jsx: code:
|
# ? Nov 24, 2014 19:19 |
|
Pollyanna posted:Require.js is bizarre and I just cannot wrap my head around it. I have a Yeoman-generated app that's based on a React UI, and I just cannot figure out how I'm supposed to add Backbone to the dependencies and be able to use it. I ran bower install backbone --save then grunt bower just like the Yo docs tell me to do, and it says that it "Updated RequireJS config with installed Bower components" , but Backbone is never actually loaded and the config doesn't actually change! Require.js has been such a pain in the rear end to wrangle that I'm really regretting using it for my project. Can anyone tell me how to get this frickin' thing to work? You need to add backbone: "path/to/backbone" to the paths key in the config. Also, require.js doesn't load anything until you reference it. Does app reference backbone in the dependency list? If not, it will not get loaded in your example.
|
# ? Nov 24, 2014 19:50 |
|
Like this?code:
|
# ? Nov 24, 2014 20:01 |
something tells me "backbone" isnt the filename you're trying to load. maybe a .js?
|
|
# ? Nov 24, 2014 20:01 |
|
Require.js doesn't want you to add the '.js', it adds them for you. Unfortunately I don't know enough about Bower or this specific usecase to provide useful information, I've only ever used require.js with web applications.
|
# ? Nov 24, 2014 20:14 |
|
Can't help with the grunt bower issue, but assuming combo-breaker-app is your app (or app layout) then Bower installs to app/bower_components (set by .bowerrc). Your paths need to reach this directory, relative to baseUrl, which is relative to the server root (/app). There's some other changes I'd suggest:
So the full app/jsx/main.js would look something like this: code:
/bower_components/backbone/backbone.js The .js extension is necessary for absolute paths. Met48 fucked around with this message at 22:56 on Nov 24, 2014 |
# ? Nov 24, 2014 22:52 |
|
Xenoveritas posted:Require.js doesn't want you to add the '.js', it adds them for you. Met48 posted:The .js extension is necessary for absolute paths. Modern web tooling is such a loving joke.
|
# ? Nov 25, 2014 01:07 |
|
Kobayashi posted:Modern web tooling is such a loving joke. It gets me every time. I will never understand why they thought it was a good idea.
|
# ? Nov 25, 2014 03:22 |
|
Because conceptually you're not including files, you're including named modules. Think of it like import in Python or use in Perl or whatever in some other scripting language that has modules. Of course I have no clue why that logic also applies to the part where you're explicitly indicating where to locate a given named module.
|
# ? Nov 25, 2014 04:37 |
|
Xenoveritas posted:Of course I have no clue why that logic also applies to the part where you're explicitly indicating where to locate a given named module. That's kind of my point. Pick one and stick with it.
|
# ? Nov 25, 2014 06:06 |
|
|
# ? Jun 5, 2024 08:18 |
|
Xenoveritas posted:Because conceptually you're not including files, you're including named modules. Think of it like import in Python or use in Perl or whatever in some other scripting language that has modules. gently caress that, I've used Python for a longass time and importing is much more clear and obvious than this. This is more like trying to write virtualenv from scratch in your own little file.
|
# ? Nov 25, 2014 17:55 |