I have a select box, and I load the form using a JSON request on load. As angularjs may take a little time to load the data, I added a temporary option in there:
<option value="">Loading...</option>
What I want to do, is clear this once my model is loaded. What currently happens, is it just appends the list to the select box, and leaves the Loading... option in there as choice #0.
I believe the default behaviour is just to append, rather than replace. How would I go abouts doing this? I can't seem to find any examples around for this particular issue.
Here's a plunk: http://plnkr.co/edit/zRQCPrMzvN8Rcg8ZyTu0?p=preview
This is pretty easy to do with Angular.
All you have to do is data-bind the default option to a variable and change that variable when the http call comes through. Here is a plunk demonstrating the same.
http://plnkr.co/edit/Vn4L5boLodSi6puzM6gh
Related
I am making an app that shows a list of items, and that list can then be refined by multiple filters. If I were to fetch a list of those options from the URL string, then that would allow visitors to share (or bookmark) a link that takes you to a filtered list of data. But my questions is how would I write those options to the URL string?
So the idea is that once a select element has been changed, to refine the results. Let's say for example that it's just the order of the items.
<select ng-model="order" ng-change="changeOrder()">
<option ng-repeat="['date', 'amplitude', 'name'] as option">{{ option }}</option>
</select>
I would want to write that option into the URL string, so that it now contains (if you've selected amplitude) ?order=amplitude. Now, if you refresh the page, the data can easily be sorted by amplitude again.
But when there is a lot of those filters and sorting options, and they can be both set or reset to default, it becomes rather difficult to put those options all together, to check if an option is already in the string so as to not have it twice, and whether to add it behind a ? if there are no other options, or a & if there are other options already defined.
So in other words, what I want to know is does ngRoute provide methods to set parameters; not just read them? So I could do something like $routeParams.set("order", "amplitude").
If you want to change the URL, you should do this through the $location service.
Specifically the $location.search(search, paramValue) will allow you to change the query string values.
I made a plunk that demonstrates both using HTML5 mode and changing the $location using these functions. It can be found here. In order to see the URL change, click the pop-out button .
You don't have to do the string parsing yourself. AngularJS will also allow you (with the same function) to query the currently set parameters. So it's a matter of querying all the URL values, changing the one for which filter you're changing, and then setting the values back.
This is what the second button in the example demonstrates. Even though the first button will only set its own value (and remove the others), the second button will keep all other items as well.
The relevant code:
var values = $location.search();
values.orderThatsUpdating = newOrderValue;
$location.search(values);
I'm creating a simple admin interface where an authenticated user is able to edit parts of a site, using firebase three-way binding (I'm using angularfire).
To be as user friendly as possible i at least want to allow them to have line breaks. Therefore i use ng-bind-html, but the problem is that real time validation will throw tons of errors until the entered html is valid (which is understandable).
I was wondering if this approach is even considered OK, or should i think differently. For example only update the view value once the user has finished typing, or create a button that would insert line breaks? Or maybe a filter that would return /n as <br>?
What are your experiences, suggestions? I dont really need html, the most i need is just line breaks.
I'm having trouble using ng-options with filters.
The problem is that when an option is removed by a filter, the model of the select element retains the value of the removed option.
Here is a plunker. I have two filters working on the ng-options set. One that removes duplicates from the list of options, and one that removes nulls. You can see the problem I am speaking of by following these steps.
In the "Preferred Email" dropdown, select the last email option, 'jimbob#yahoob.com'.
Delete the text in the "Other Email" input box.
You can see now that because "Other Email" is null, it is no longer an available option, and the dropdown has defaulted to "Please Select Preferred Email". However the model of the select element still has that object assigned to it.
Same problem different context.
In the "Preferred Email" dropdown, select the option 'jimbob#yahooz.com'.
Now delete the 'z' in "jimbob#yahooz.com"
Upon doing so, the values in the two input boxes ('Email' and 'Home Email') become duplicates, and the second one ('Home Email') becomes filtered out of the available options. However the object that was just filtered remains assigned to the model.
Edit: My solution (Can anyone do better?)
Here (plunker) is the best I could come up with. I'm new to angular and can't help but think there is a better way to do this, I think this solution is "bad" but it works.
Essentially I pass into the filters a reference to the scope (this.contact) along with the name of which default item I am working with ('default_email' or 'default_phone'). If the filter is removing an item from the options set, it checks if it is the default, and if it is, sets the default to undefined.
I also added a bit more code, to get more context as to what I am working towards.
I know this is old, but I spent a long time trying to figure out the best way to handle this.
Turns out it's fixed in Angular 1.4! Try replacing the Angular version in your original plunker with 1.4, and the problem just goes away. I found this out by trying various versions until I narrowed it down.
I have a formPanel with two of the form items as comboboxes with their stores populated by the database. The value from comboBoxA needs to be used to get the value for comboBoxB however comboBoxA.getValue() (as well as getRawValue()) are returning undefined.
storeA.load();
var comboBoxA = Ext.getCmp(comboBoxAID);
storeB.baseParams.UserID = comboBoxA.getValue();
storeB.load();
As noted in the docs, store loading is asynchronous, so you have to do your additional processing within the appropriate callback:
storeA.on('load', function(){
var comboBoxA = Ext.getCmp(comboBoxAID);
storeB.baseParams.UserID = comboBoxA.getValue();
storeB.load();
});
storeA.load();
Loading a ComboBoxes store does not actually select a value. Try making a selection first (or loading a record into the form, etc). It sounds like your trying to link the 2 combos. If thats the case, search around for a tutorial, there are few out there. This should get you started, Linked Combos.
You might want to try this. It might be exactly what you are looking for. It also has a demo on the same page. The page is in german but the demo is predictable and the code is in english so test this.
On the Cognos Report Results Page, we need to have a checkbox for each row.
The checkbox is designed using HTMLITEM tag.
However, the problem we face is that the state of the checkbox (checked or unchecked) is not persisted when we go to the next page/previous page.
I am very new to Cognos and I need to know if there is a way to do this.
I am fairly good at JAVAScripting and JSP, but since we only have access to HTML elements and not JSP Tags (Cognos uses CGI anyways), I cannot get the request object.
If there is some way to retrieve the request objects parameters of previous submit(previous page), that would help in solving the issue to a large extent, I feel.
Jonas
There isn't really enough information on what your end goal is to be able to assist you with this properly. There are a few ways that spring to mind that would allow you to use JS on the report to remember previously checked items, but there may be a much better way to do this depending on your requirements.
Without having more details, the first thing that leaps to mind is simply having some JavaScript set and unset cookie values on check/uncheck on the checkbox.
Note, there could be a variety of other ways to work this, including upping the number of visible rows per page, etc...
You can create a dataitem in a query where you can determine whether your checkbox should be checked or not. In the design of your list on the report page you can render a HTMLItem within the list, and base the HTMLItem on a DataItem. Your HTML must than be something like
<input type="checkbox" value="""+ [DataItemValueToPass] + """ " + [DataItemCheckedOrNot] ></input>