I am trying to enter text in redctor text field to test functional testing by geb.But i am not able to do so because textarea is invisible.when it is simple html text field than i am able to do so by personal{$("#personalStatement").value("hi I AM HERE")} but in this case it is not working .I have used in testspec like this also personalStatement ="i am here" but not woking.
<div class="redactor_redactor_content_cv redactor_ui-wizard-content redactor_editor"
contenteditable="true" dir="ltr" style="min-height: 200px;"> <p></p> </div> <textarea
id="personalStatement" class="redactor_content_cv ui-wizard-content" width="98%"
height="100px" name="personalStatement" dir="ltr" style="display: none;"> </textarea>
Use send keys method for entering values in textarea.
$("#personalStatement").firstElement().sendKeys("Test")
Related
I have a form with id theForm which has the following div with a submit button inside:
<div id="placeOrder"
style="text-align: right; width: 100%; background-color: white;">
<button type="submit"
class='input_submit'
style="margin-right: 15px;"
onClick="placeOrder()">Place Order
</button>
</div>
When clicked, the function placeOrder() is called. The function changes the innerHTML of the above div to be "processing ..." (so the submit button is now gone).
The above code works, but now the problem is that I can't get the form to submit! I've tried putting this in the placeOrder() function:
document.theForm.submit();
But that doesn't work.
How can I get the form to submit?
Set the name attribute of your form to "theForm" and your code will work.
You can use...
document.getElementById('theForm').submit();
...but don't replace the innerHTML. You could hide the form and then insert a processing... span which will appear in its place.
var form = document.getElementById('theForm');
form.style.display = 'none';
var processing = document.createElement('span');
processing.appendChild(document.createTextNode('processing ...'));
form.parentNode.insertBefore(processing, form);
It works perfectly in my case.
document.getElementById("form1").submit();
Also, you can use it in a function as below:
function formSubmit()
{
document.getElementById("form1").submit();
}
document.forms["name of your form"].submit();
or
document.getElementById("form id").submit();
You can try any of this...this will definitely work...
I will leave the way I do to submit the form without using the name tag inside the form:
HTML
<button type="submit" onClick="placeOrder(this.form)">Place Order</button>
JavaScript
function placeOrder(form){
form.submit();
}
You can use the below code to submit the form using JavaScript:
document.getElementById('FormID').submit();
<html>
<body>
<p>Enter some text in the fields below, and then press the "Submit form" button to submit the form.</p>
<form id="myForm" action="/action_page.php">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br><br>
<input type="button" onclick="myFunction()" value="Submit form">
</form>
<script>
function myFunction() {
document.getElementById("myForm").submit();
}
</script>
</body>
</html>
HTML
<!-- change id attribute to name -->
<form method="post" action="yourUrl" name="theForm">
<button onclick="placeOrder()">Place Order</button>
</form>
JavaScript
function placeOrder () {
document.theForm.submit()
}
If your form does not have any id, but it has a class name like theForm, you can use the below statement to submit it:
document.getElementsByClassName("theForm")[0].submit();
I have came up with an easy resolve using a simple form hidden on my website with the same information the users logged in with. Example: If you want a user to be logged in on this form, you can add something like this to the follow form below.
<input type="checkbox" name="autologin" id="autologin" />
As far I know I am the first to hide a form and submit it via clicking a link. There is the link submitting a hidden form with the information. It is not 100% safe if you don't like auto login methods on your website with passwords sitting on a hidden form password text area...
Okay, so here is the work. Let’s say $siteid is the account and $sitepw is password.
First make the form in your PHP script. If you don’t like HTML in it, use minimal data and then echo in the value in a hidden form. I just use a PHP value and echo in anywhere I want pref next to the form button as you can't see it.
PHP form to print
$hidden_forum = '
<form id="alt_forum_login" action="./forum/ucp.php?mode=login" method="post" style="display:none;">
<input type="text" name="username" id="username" value="'.strtolower($siteid).'" title="Username" />
<input type="password" name="password" id="password" value="'.$sitepw.'" title="Password" />
</form>';
PHP and link to submit form
<?php print $hidden_forum; ?>
<pre>Forum</pre>
I have the following HTML:
<label for="file-input-76eb2" id="ember3042" class="c-text-input c-text-input o-grid-cell--6 file-upload ember-view">
<input id="file-input-76eb2" type="file" accept="text/csv" style="display: none;">
<span class="c-file-upload__input-filename"></span>
<a class="c-button c-button--single-action-primary c-file-upload__input-button">
Select
</a>
</label>
I have managed to get a Capybara::Node:Element corresponding to the label tag, but I can't get to the input. The id is dynamic- constantly changing. Moreover, I need to upload a file to this input tag.
Is there any information what I can do? This is all using google-chrome-headless.
This is using Ruby, with Capybara, with Selenium.
Looks like
label_element.find(:xpath, '//input') did it!
I am new to grails and groovy.
I am trying to find out how to render a response from an action in a grails controller IN THE SAME gsp - but in a DIFFERENT SECTION OF THE gsp - as the gsp that takes the request (in this case a web form gsp page)?
any links or turorials or just straight to the point "do this" kind of replies are welcomed.
I tried to google search for it, but I was not sure what to use as a search term and I could not find a concise answer.
========= UPDATE TO QUESTION (INCLUDING SOME CODE) =========
Here is the code I am working with. It is a Grails application in which I am using a bootstrap template (available for free on the internet of course).
Now the actual code itself for functionality works. What I am having an issue with is this:
I have a gsp page that uses a css template and another gsp temlate for layout. I can start the page as inside the gsp+css tempate using this code (snippet) in my gsp page:
<g:layoutBody/>
This allows me to call my calling controller code in this gsp file for the request:
<body>
<g:form name="form" controller="apiStart" id="form">
<div><g:select name="protocolType" value="restCall" from="${["-select-", "GET", "POST", "PUT", "DELETE"]}"/>   <label>URL: </label><g:textField name="url" value="${url}" />
  <label>username: </label><g:textField name="userName" value="${userName}" />   <label>password: </label><g:textField name="passWord" value="${passWord}" /></div>
%{--<div class="text-field"><label>URL: </label><g:textField name="url" value="${url}" /></div>--}%
%{--<div class="text-field"><label>username: </label><g:textField name="userName" value="${userName}" /></div>
<div class="text-field"><label>password: </label><g:textField name="passWord" value="${passWord}" /></div>--}%
<br>
<div><label>Use Advanced Parameters?</label><g:checkBox name="useAdvParms" value="${false}" /></div>
<div class="text-field"><label>Header1: </label><g:textField name="header1" value="${header1}" />   <label>Value1: </label><g:textField name="value1" value="${header2}" /></div>
%{--<div class="text-field"><label>Value1: </label><g:textField name="value1" value="${header2}" /></div>--}%
<div class="text-field"><label>Header2: </label><g:textField name="header2" value="${header3}" />   <label>Value2: </label><g:textField name="value2" value="${header4}" /></div>
%{--<div class="text-field"><label>Value2: </label><g:textField name="value2" value="${header4}" /></div>--}%
<br>
<div class="submit"><g:actionSubmit value="Submit" action="save"/></div>
</g:form>
</body>
And then this gsp code for the response:
<body>
<h3>API Test Results</h3>
API Tested: ${apiStart.url}, Response: ${apiStart.response3}
<br>
%{--<g:textArea name="myField" value="myValue" rows="20" cols="100"/>--}%
<div class="textarea"><label>Output</label><br><g:textArea name="myField" value="${apiStart.result3}" />
</div>
%{--Responce Code: ${apiStart.response3}<br>--}%
%{--Response: <br> ${apiStart.result3} <br>--}%
</body>
My issue: it works fine as separate pages. I want to render the results of the request on the same page as the calling request.
in the screen shot attached: I want to put the results in the text box where it says "Output Displayed here...."
I assumed templates in grails is the way to go about it. but I get a Java Null pointer exception when I try to insert the template into that part of the code.
Can someone advise and show me the best way to do this?
==================== END of Updated question ===================
thanks.
ironmantis7x
You can try using Grails templates.
Basically Template is a (reusable) part of a View.
Info:
So you create template file bookTemplate.gsp, put all the gsp/html code in there as usual (but just the part, if it will be used in the body, then don't add html, body, head tags etc.
Example:
<div class="book" id="${book?.id}">
<div>Title: ${book?.title}</div>
<div>Author: ${book?.author?.name}</div>
</div>
Then you render that template into the gsp page in places where you want them to be (with a simple grails render tag. And it will simply get compiled (as the code from template would be pasted into gsp view).
Render:
<g:render template="bookTemplate" model="[book: myBook]" />
I don't know your grails version, but on 2.4.5, and maybe on your version, you can use :
http://docs.grails.org/2.4.x/ref/Tags/submitToRemote.html
And have a look to the attribute update :
update (optional) - Either a Map containing the elements to update for
'success' or 'failure' states, or a string with the element id to
update, in which case failure events would be ignored
And you also can trigger javascript on some events, ...
In your action called in the submitToRemote button, you can render a template (but do not put your layout in this template if you render a template, otherwise you will have all you website structure rendered...) and it will be displayed in the HTML element with the ID that you have put in "update" property.
The example given in the link is interesting.
Using select2 is really cool but I would simply like my input to stay a simple, basic search box, without the fancy styling and formatting from select2. I couldn't find a way to achieve this yet.
Is there a simple way to do this?
Thanks
Try Bootstrap Typeahead
http://twitter.github.io/bootstrap/javascript.html#typeahead
//JS
var subjects = ['PHP', 'MySQL', 'SQL', 'PostgreSQL', 'HTML', 'CSS', 'HTML5', 'CSS3', 'JSON'];
$('#search').typeahead({source: subjects})
//HTML
<div class="well">
<input type="text" class="span3" id="search" data-provide="typeahead" autocomplete="off" data-items="4" />
</div>
See example here: http://jsfiddle.net/6XG8F/
I would like to have the filterPane to be inserted in my own div in order to fit my page layout. Basically I want to get rid of the default pop-up behavior and harmonize filterPane with the other elements of the application.
this is my gsp
<div class="filter">
<p>
<filterpane:isFiltered>
<filterpane:currentCriteria domainBean="demoracer.Pilot" />
</filterpane:isFiltered>
</p>
<g:formRemote method="post" name="form_search" url="${[action:'list']}" update="listContainer" >
<filterpane:filterPane customForm="true" formName="form_search" domainBean="demoracer.Pilot"
filterProperties="name," id="filterpaneContainer" />
<g:actionSubmit value="Apply Filter From Outside Filter Pane" action="list" />
</g:formRemote>
</div>
but the pane do not show up.
Thanks
Since the filterpane generates its own div, can't you just use the div it generates and restyle it to fit your layout? You can specify the id, class, and style attributes of the container div it generates. That should be more than enough to restyle it any way you'd like.
it doesn't seems possible since the html is statically created by the taglib
def output = """\
<div id="${containerId}"
class="filterPane ${containerClass ?: ''}"
style="display:none;${containerStyle}">
<h2>${title}</h2>
${openFormTag}
<input type="hidden" name="filterProperties" value="${propsStr}" />
<table cellspacing="0" cellpadding="0" class="filterTable">
"""