I'm using a angular xeditable text control. I want to open it in edit mode automatically. How can I do it?
My question is similar to this one however, I am not using editable-form (not using a form element at all). The only solutions I find are using the editable-form's $show() function, but you do not have it if you do not have an editable-form.
While at it, I also would like to use the functionality provided by editable-form's $setError() function, without using an editable-form and not through the onbeforesave or onaftersave attributes (I want to do it upon opening the xeditable text control, not when user submits). Is it possible ?
I do not want to use an editable-form because I have just this one xeditable input, and the use of a form changes things like submit, blur, buttons displayed, etc. in ways that I do not want.
Related
Note: I am not well versed with angularjs/frontend dev as such, so I may be using wrong words/terms.
I have a form as a result of a html and a controller. Controller has functions defined which are invoked when user performs some actions as defined in html, like clicking a button.
One of the UI element in the form is ui-select. It enables user to select multiple values from a dropdown.
What I want is that when user clicks on one of the selected value from ui-select, a new dialog window opens up wherein user can provide some input value, close it, return to original open form, and value from dialog box gets appended to the original clicked value from ui-select.
I want to know what is best way of creating an input dialog box in angular.
I see $uibModal being used which can be used to create a form by combining a html and a controller. But I have a usecase for a simple dialog box. So it seems $uibModal is bit of an overkill.
Is there an easier way of doing this?
I'm currently maintaining an AngularJS application and need to have html inputs use the ngRequired directive. However these inputs do not use ngModel-- just straight up value to display the value dynamically and ngClick to popup a modal window that will eventually set the value in an object that is not bounded to a model. Seems like ngRequired only works when paired with ngModel in order for the submit button to reflect changes appropriately (like enable/disable).
I tried to work around not using ngRequired by manipulating the ngInvalid CSS which works great for showing the required fields-- however it does not bubble up to the submit button (disabling it if one or more required fields have no input). Is there a way to emulate ngRequired without using it explicitly in AngularJS?
In Sitecore MVC, FieldRenderer.Render(Item, "Field Name") automatically checks its field type. In another word, all XSLT extensions (sc:text, sc:image, sc:date, …) is affected by the RenderField pipeline.
But, I couldn't find sc:checkbox information and it doesn't show "CheckBox" in page edit mode. It just shows the value of the check box.
How can I make it show as like input type=checkbox in page editor?
Sorry for the link only answer but the general approach here is to use a Field Editor Button.
This will open a pop up window with the content editor style control for the field.
If using a custom experience button is not an option for you, you can output different markup (i.e. your input button) to the client when the page mode is in 'Edit' mode.
This will allow you to present the author with the controls you wish to display, but still output the normal output values for end users.
If you are able to use controller renderings, you can use the controller to load a different view to make this easier, but otherwise you can use if statements within your View to output different markup.
I would like to use the angular x-editable directive to work with a text field per the following
(a) I don't want to display buttons. I tried the buttons=no option but it does not seem to work with input of type text.
See the fiddle here.
(b) I want the underlying ng-model property to update immediately with each keystroke , without waiting for the user to focus out of the input. (as is default behavior with vanilla angular, eg. <input type=text ng-model="somepropertyname" />
How can one achieve (a) and (b) with angular x-editable? link to fiddle
Answer to 1(a) is to add the blur="submit" attribute (in addition to buttons="no")
I have a select2 input box the defined like this:
<input id="searchbox" ui-select2="autoCompleteSearch" ng-model="searchedLeafs" style="width:80%;height:36px;" class="searchbox"/>
Basically, while the user can type text into the input box (and select from the suggested autocomplete list), i would also would like to enable the user to click on an angular-based button (on the same scope) which "inject" a tag into this input box (instead of the user typing it).
Does anyone can tell me how you can do it property in angularjs? i know how to do it in the old plain select2, but coulnd't find how can you manually/dynamically add items (key/value) to the list of tags.
if you want to get a simple example, lets say that instead of you typing the tags that you want to associate with stackoverflow question, you would simply click on a link/button which would add it to the list of tags yourself.
Thx
Simply push a new object into the ng-model's array and assuming it's duck-typed to the rest of the objects it should show up fine.