Not able to display editable multiline field fully - Maximo Anywhere - javascript

How do I display multiline text in editable textbox on device screen? At the moment, if the text is not editable then it shows the full text in multiline. The same value is displayed in 2 textboxes, one is editable and one is non-editable.
<groupitem id="WorkExecution.groupitem_1">
<text cssClass="richText" editable="false"
id="WorkExecution.groupitem_1_abc" resourceAttribute="abc"/>
</groupitem>
<groupitem id="WorkExecution.groupitem_2">
<text cssClass="richText" editable="true"
id="WorkExecution.groupitem_2_xyz" placeHolder="Tap to enter"
resourceAttribute="xyz"/>
</groupitem>
e.g. if the value reads -
IBM® Maximo® Anywhere gives you remote access from most mobile devices to Maximo Asset Management processes – work and asset management. It is built with an interface that is customizable, so you can create your own assets.
then the value of abc is displayed properly in multiline format whereas value of xyz is displayed in a single line and not in multiline.
Do I need to apply any CSS here?

In the OOB app.xml if you look at the view
<view editableView="WorkExecution.NewWorkLogView" id="WorkExecution.WorkLogDetailView" label="Work Log Entry">
You will see the multi line editable detail attribute near the bottom
<groupitem id="WorkExecution.WorkLogDetailView_workOrder_groupitem_5">
<text cssClass="richText" editable="false" id="WorkExecution.WorkLogDetailView_workOrder_groupitem_5_details_Details" label="Details" resourceAttribute="details"/>
</groupitem>
As you already have the editable and css attributes set, my guess is that on your view it is not defined as an editableView.

For a editable multiline widget you need to use the textarea widget. See our WorkLog details page in 7.5.2 for an example.
<groupitem id="WorkExecution.NewWorkLogView_workOrder_groupitem_5">
<textarea editable="true" id="WorkExecution.NewWorkLogView_details_0" label="Work Log Details" placeHolder="Tap to enter" resourceAttribute="details"/>
</groupitem>

Related

Nativescript - Set Unsafe Text to Label

I'm using nativescript core....
I have a label that I'm binding with text that comes from an api. The text that's coming from the api looks like this...
This is some text
with a linebreak
The label will display with a line break if hardcoded directly like this...
<Label id="lyrics" text="This is some text
with a linebreak" verticalAlignment="top" horizontalAlignment="center" />
But if you bind it through code it will not
var label = view.getViewById(page, "lyrics");
label.text = valueFromApi
Is there any way to set encoded values like this to labels?

Ace editor (form) - Can I preserve line breaks/text format?

Working on a project for my school building an MVC Sinatra application. I want to create a web app that can save and display back snippets/algos using ace editor.
I figured out how to (seemingly) capture form input through ace editor by hiding the input field and assigning the value from ace on change with the snippet below.
//CAPTURE/SET VALUE
var textarea = $('input[name="content"]');
editor.getSession().on("change", function () {
textarea.val(editor.getSession().getValue());
});
my form looks like this
<!--ACE EDITOR-->
<div id="editor"></div>
To open settings panel, inside editor - CTRL+Q (Windows) | CMD+Q (Mac)
<!--------------------------------------------------------->
<!--FORM-->
<form action="/ace" method="POST">
<!--normal-->
<input type="text" name="content" style="display: none;" />
<!--submit-->
<input type="submit" value="Save">
</form>
I can capture the params fine but the problem is it doen't preserve the line breaks so entering...
def something
end
into ace editor and clicking submit gives me back
"def something end"
when I would love in theory to get something like
"def something\n\nend"
or something of the sort.. you get the drift
I need to be able to somehow use the editor to capture input, and on submit assign that to an object attribute so pseudo
snippet = Snippet.new(:content => params[:content])
then be able to call that back and display back on editor in the right format
snippet.content (preserves linebreaks)
Full code and images HERE if you rather visuals.
Any help would be appreciated and if there is anything I'm missing out please let me know.. hope I've supplied sufficient info and detailed properly.
input doesn't accept newlines, you need to use textarea instead.

Can not type in a text box using python selenium

I'm trying to send keys to the following textarea html using python selenium:
<div class="spk-c spH-d"><div id="gwt-uid-23" class="sppb-a">
<div class="sppb-b spk-b">For example, flowers or used cars</div>
<textarea rows="2" aria-labelledby="gwt-uid-64 gwt-uid-23" id="gwt-debug-keywords-text-area" class="spk-a sppb-c">
</textarea>
</div>
<div role="alert" class="error" style="display:none"> Input contains a keyword that is too long. </div> <div class="error" style="display:none">Your product or service description can't exceed 1,000 words. Remove some words and try again.
</div>
</div>
and I get this error:
selenium.common.exceptions.ElementNotVisibleException: Message: Element is not currently visible and so may not be interacted with
Stacktrace:
here is my code:
textarea='textarea[id="gwt-debug-keywords-text-area"]'
element = WebDriverWait(driver, 15).until(lambda driver : driver.find_element_by_css_selector(textarea))
driver.find_element_by_css_selector(textarea).send_keys('plumbers')
Can you please help me out? It's been bugging me for a while. The html is from google keyword planner.
Thank you
You can use expected conditions to wait for the text box visibility
WebDriverWait(driver, 15).until(expected_conditions.visibility_of_element_located((By.ID, 'gwt-debug-keywords-text-area'))).send_keys('plumbers')
Edit
You need to switch to the iframe with the textarea in order to interact with it
# by the frame id attribute
driver.switch_to.frame(id)
# by the frame name attribute
driver.switch_to.frame(name)
# by the frame webelement
frame = drive.find_element(...) # locate the frame
driver.switch_to.frame(frame)
And to switch back
driver.switch_to.default_content()
The problem may not be with your selenium code, but the workflow for using the tool. I am not familiar with this adwords keyword planner, but when I did a Google search for the id of that text area and selenium, I came across some github code that looks like it is enabling the text area first:
browser.find_element_by_id("gwt-debug-splash-panel-find-keywords-selection-input").click()
browser.find_element_by_xpath("//textarea[#id='gwt-debug-keywords-text-area']").send_keys(keyword)
Try to use JS code to make element visible before sending text:
driver.execute_script("document.getElementById('gwt-debug-keywords-text-area').style.visibility = 'visible';")
driver.execute_script("document.getElementById('gwt-debug-keywords-text-area').style.display='bloc‌​k';")
Let me know if any exceptions occurs
UPDATE
If you want to send text to text area using JS you might need to execute following:
driver.execute_script("document.getElementById('gwt-debug-keywords-text-area').innerHTML='Here is some text';")
or
driver.execute_script("document.getElementById('gwt-debug-keywords-text-area').value='Here is some text';")

ADD ITEM button in a simple Joomla Module

I am creating a simple and FREE joomla module that will slide items added by a user. I dont know how to create a "ADD ITEM" button in the module that will repeat the field in the admin screen of the module to allow the next entry.
Example - Below is how my module backend will look
My Module has a field group
<fieldset name="sliders" description="To add an item,Click Add New" label="Item - ADD/EDIT Here">
<field type="sliders" name="sliders" />
</fieldset>
Then I have a fields folder in the module with a sliders.php
Not sure where to go from here.
For this you would need to make a new form field which will not be easy.
a simpler (built in) solution would be to use jform repeatable.
https://docs.joomla.org/Repeatable_form_field_type
ok, So Joomla 3 has its own repeatable field option. Just used the code below and worked.
<field name="list_templates"
type="Repeatable"

JavaScript - multi-line textbox in prompt()?

Is there anyway to make the textbox/input box in prompt multiline?
No, browsers only allow single-line input for prompt(). However, with a simple change to the jQuery Alert Dialogs library you could get multi-line input there. Take jquery.alerts.js, look for <input type="text" size="30" id="popup_prompt" /> and replace it by <textarea rows="5" cols="30" id="popup_prompt"></textarea>. That should do to have a multi-line input field show up when calling jPrompt().
Edit: As Mulletfingers999 points out in a comment, jQuery Alert Dialogs have been deprecated in favor of jQuery UI dialogs. There you can also show a "modal" dialog, that dialog can have arbitrary content however - meaning that a <textarea> tag is possible if you want multi-line input.
Use \n encased in double quotes ("\n")
prompt("This\nis\nmultiline");
For pretty much any user-facing web application these days, you're going to want to avoid using clunky old dialogs like alert() and prompt(). Almost any library you're using should have a much better answer. jquery would be fine as others have said. It would also be good to think of how you might eliminate a need for modality by designing a more clever interface.
"Interestingly", in Firefox they are already using XUL and reinventing a lot of user interface based on that (instead of relying on the "common dialogs" of the underlying OS). There's a template for modal dialogs in /source/toolkit/components/prompts/content/tabprompts.xml:
<vbox anonid="infoContainer" align="center" pack="center" flex="1">
<description anonid="info.title" class="info.title" hidden="true" />
<description anonid="info.body" class="info.body"/>
</vbox>
<row anonid="loginContainer" hidden="true" align="center">
<label anonid="loginLabel" value="&editfield0.label;" control="loginTextbox"/>
<textbox anonid="loginTextbox"/>
</row>
<row anonid="password1Container" hidden="true" align="center">
<label anonid="password1Label" value="&editfield1.label;" control="password1Textbox"/>
<textbox anonid="password1Textbox" type="password"/>
</row>
<row anonid="checkboxContainer" hidden="true">
<spacer/>
<checkbox anonid="checkbox"/>
</row>
What they do is just hide the elements of the UI that they don't need. In the case of a call to prompt, they re-use the user name field and keep the password and checkbox elements hidden. You can see this happening in /source/toolkit/components/prompts/src/CommonDialog.jsm#52:
case "prompt":
this.numButtons = 2;
this.iconClass = ["question-icon"];
this.soundID = Ci.nsISound.EVENT_PROMPT_DIALOG_OPEN;
this.initTextbox("login", this.args.value);
// Clear the label, since this isn't really a username prompt.
this.ui.loginLabel.setAttribute("value", "");
break;
Since it's more or less HTML, the only question is what the non-standard tag <textbox> means for the user interface. The XUL controls documentation informs us that it's only a one-line entry, you would need <textarea> for more:
https://developer.mozilla.org/en/XUL_controls
I thought it would be "fun" to look at the implementation in Chromium on top of GTK too. After a bit of digging through the circuitous wrappers of WebKit, I did manage to find chromium/src/chrome/browser/ui/gtk/js_modal_dialog_gtk.cc, specifically this part:
// Adjust content area as needed. Set up the prompt text entry or
// suppression check box.
if (ui::MessageBoxFlags::kIsJavascriptPrompt == dialog_->dialog_flags()) {
GtkWidget* content_area =
gtk_dialog_get_content_area(GTK_DIALOG(gtk_dialog_));
GtkWidget* text_box = gtk_entry_new();
gtk_entry_set_text(GTK_ENTRY(text_box),
UTF16ToUTF8(dialog_->default_prompt_text()).c_str());
gtk_box_pack_start(GTK_BOX(content_area), text_box, TRUE, TRUE, 0);
g_object_set_data(G_OBJECT(gtk_dialog_), kPromptTextId, text_box);
gtk_entry_set_activates_default(GTK_ENTRY(text_box), TRUE);
}
The text_box is created with gtk_entry_new() and the GTK documentation states that GtkEntry is "A single line text entry field". For multi-line entry you would have to use GtkTextView:
http://developer.gnome.org/gtk/2.24/GtkTextView.html
So there's your answer not just of "can you?" but the smoking guns of why you can't (in a couple of popular browser implementations.) Unless there's a way to override that XUL in Firefox with an extension of some kind, which there may well be! I'll leave it as an exercise for the reader. :P

Categories

Resources