I am currently working my automator and it has a limit to operate I think this method is the solution,
I'm having trouble on how to click this link, if anyone can help me create AppleScript using safari app. that would be help me save a lot of time.
If you can help combine applescript and jQuery or javascript for this to click
Here is the target link to click
Edit
bunch of them HTML:
<td class="new-variants-table__cell">
<div class="next-field__connected-wrapper next-field__connected-wrapper--align-right">
Edit
<button class="ui-button ui-button--size-small" data-bind-event-click="deleteVariantModal_27652747591744.show()" data-track-click="{ action: 'Delete variant', category: 'Products' }" type="button" name="button"><svg aria-hidden="true" focusable="false" class="next-icon next-icon--size-20"> <use xlink:href="#delete-minor"></use> </svg></button>
</div>
<script data-define="{deleteVariantModal_27652747591744: new Shopify.Modal(this)}" type="text/html" class="modal_source"><header><h2>Delete Chrome?</h2><button type="button" name="button" class="btn--link close-modal">Close</button></header>
<form class="edit_product_variant" id="edit_product_variant_27652747591744" autocomplete="off" data-define="{ deleteForm: new Shopify.Form(this) }" data-tg-refresh-on-success="modal variant-row-27652747591744" data-tg-remote="true" action="/admin/products/3424746569792/variants/27652747591744" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="✓" /><input type="hidden" name="_method" value="delete" /><input type="hidden" name="authenticity_token" value="vHjz4tkmojd0dpVMZeZsQt3Bn/EaumOoZrNxR1awHaHaQnNQSsO1YxJglzNwoNthWoBwIlCjlxVPwmiLpTc5UA==" />
<div class="body">
<p>
Are you sure you want to delete the variant <strong>Chrome</strong>? This action cannot be reversed.
</p>
</div>
<div class="buttons">
<button class="ui-button close-modal" type="button" name="button">Cancel</button>
<button class="ui-button js-btn-loadable btn-destroy-no-hover" type="submit" name="button">Delete</button>
</div>
</form></script>
</td>
Related
<form *ngIf="data.yesAsLink" id="myForm" ngNoForm [action]=action method="post"
target="pay" onsubmit="window.open('about:blank','pay','width=1050,height=860');"
style="display: inline; margin-left: 20px;">
<input type="hidden" name="ClientId" value="ExelaRON" />
<input type="hidden" name="Param" [value]=input />
<button type="submit" (click)="onYesClick(this)"
mat-button class="btn primary-btn" value="Submit"
style="font-size: 14px;">Pay now</button>
</form>
this code is in component html file and opening child window by submitting form. how to track close window event on this?
I have a form as a popup and I want to add a cancel button to close current popup. I tried many ways to do it but it is not closing
<form id="overlay_form_uploadGenFile" action="/crm/saveGeneralFile" method="POST" class="overlay_form" style="display:none" enctype="multipart/form-data">
<h1 style="font-size: 2em">Edit uploaded file</h1>
<input type="hidden" name="fileId" value="0"/>
<input type="hidden" name="userId" value="{{userId}}"/>
<span>Category:</span><span id="file-filter-by">Filter by:</span> <select name="fileCategoryTagId" onchange="populatePopupCategories(this);"></select>
<div id="file-category-select"><select name="fileCategoryId" onchange="getShareWithIntegrationServicesForPopup(this.options[this.selectedIndex].value);"></select></div><br/>
Current File: <input type="text" name="filename" class="currentFile"/> (change it to rename the file)<br/><br/>
To replace <input type="file" name="fileData" class="replaceFile" /><br/><br/>
<input type="checkbox" name="editableByHR" class="editableHR"/> Editable by HR
<input type="checkbox" name="sharedWithEmployee" /> Shared With Employee <br/>
Notes <textarea name="notes" class="fileUpdateNotes"></textarea><br/><br/>
<br/>
<div class="integrationServicesContainerHolder">
</div>
<br/>
<div style="display: inline-block;width: 100%">
<div align="left" style="float: left">
<input type="submit" value="Save" align="left" class="submitFileUpdateButton"/>
<input type="button" value="Cancel" onclick="closeFunction" align="left" class="submitFileUpdateButton"/>
</div>
<div align="right" style="float: right">
<input type="submit" value="Delete" align="right" class="submitFileUpdateButton"/>
</div>
</div>
</form>
and the function side is
function closeFunction() {
$('#overlay_form_uploadGenFile').hide();
}
I have tried .dialog('hide') and .modal('hide') as well but still not working. If I try self.closeAll then it is closing all tab. How can I close only this form dialog popup ?
edit: ok I put $('#overlay_form_uploadGenFile').fadeOut(100); and problem is solved almost... I need immediate close because fadeOut is blocking me for calling other functions due to asynchronous calls.
My suggestion would be to use the break function. That will exit the current loop.
I have a page with many product listed. Each of those products is inside a div and has a form like this:
<form class="cart" method="post" enctype="multipart/form-data">
<input type="hidden" name="add-to-cart" value="">
<button type="submit" class="single_add_to_cart_button button">Add to Cart</button>
</form>
As you can see the value of add-to-cart is missing.
In the same div where the form is, we have an other div like this that contains the ID of the product (for instance IDPRODUCT), that needs to go inside the value:
<div class="vc_gitem-woocommerce vc_gitem-woocommerce-product-id hideidfromcart vc_gitem-align-left">IDPRODUCT</div>
I need a javascript function that on document ready(?) or onmouseover the div searches for the value inside the div, for instance IDPRODUCT, and copy this value into the value of the input name="add-to-cart"
Of course for each of those different divs there should be the proper IDPRODUCT.
Here is one JSFiddle I tried but it doesn't seem to work:JSFiddle
Any idea of how to solve this?
Thank you so much
UPDATE
The full Example again
$('.cart-add-wrapper').each(function(){
var id = $(this).find('.vc_gitem-woocommerce-product-id').text();
$(this).find('input[name=add-to-cart]').val(id);
console.log("id", id);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="cart-add-wrapper">
<form class="cart" method="post" enctype="multipart/form-data">
<input type="hidden" name="add-to-cart" value="">
<button type="submit" class="single_add_to_cart_button button">Add to Cart</button>
</form>
<div class="vc_gitem-woocommerce vc_gitem-woocommerce-product-id hideidfromcart vc_gitem-align-left">4321</div>
</div>
<div class="cart-add-wrapper">
<form class="cart" method="post" enctype="multipart/form-data">
<input type="hidden" name="add-to-cart" value="">
<button type="submit" class="single_add_to_cart_button button">Add to Cart</button>
</form>
<div class="vc_gitem-woocommerce vc_gitem-woocommerce-product-id hideidfromcart vc_gitem-align-left">1234</div>
</div>
I need help with the javascript. I'm trying to display a dynamic name inside the modal using multiple forms. Here is what I have, but it says "Are you sure you want to delete bob?" but I want it to display tom if I click on the delete tom button.
Forms:
<form role="form" id="formfield" action="<?=$_SERVER['PHP_SELF']?>" method="post">
<input type="hidden" name="username" id="username" value="bob" />
<input type="hidden" name="delete_id" id="delete_id" value="45" />
<button type="button" name="btn" value="Delete" id="submitBtn" data-toggle="modal" data-target="#confirm-delete" class="btn btn-xs btn-danger tooltip-error no-border" style="padding:5px; width:30px; height:30px;" /><i class="fa fa-trash-o bigger-120"></i></button>
</form>
<form role="form" id="formfield" action="<?=$_SERVER['PHP_SELF']?>" method="post">
<input type="hidden" name="username" id="username" value="tom" />
<input type="hidden" name="delete_id" id="delete_id" value="48" />
<button type="button" name="btn" value="Delete" id="submitBtn" data- toggle="modal" data-target="#confirm-delete" class="btn btn-xs btn-danger tooltip-error no-border" style="padding:5px; width:30px; height:30px;" /><i class="fa fa-trash-o bigger-120"></i></button>
</form>
Modal:
<div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
Confirm Submit
</div>
<div class="modal-body">
Are you sure you want to delete <span id="deletename_id">?
</div>
<div class="modal-footer">
<button type="button" id="cancel" class="btn btn-default success" data-dismiss="modal">Cancel</button>
Delete
</div>
</div>
</div>
</div>
Javascript:
<script>
$('#submitBtn').click(function() {
$('#deletename_id').text($('#username').val());
});
$('#delete').click(function(){
$('#formfield').submit();
});
</script>
First of all, you need to use submitBtn class, because you have two elements with same id.
Please try this:
$('.submitBtn').click(function() {
$('#deletename_id').text($(this).parents('form').find('input').eq(0).val());
});
Another method is to use this method:
$('#deletename_id').text($(this).parents('form').find('#username').val());
In both methods, you need to find the form which contains the button clicked and , then, you need to find the input.
$('.submitBtn').click(function() {
$('#deletename_id').text($(this).parents('form').find('input').eq(0).val());
});
$('#delete').click(function(){
$('#formfield').submit();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<form role="form" id="formfield" action="<?=$_SERVER['PHP_SELF']?>" method="post">
<input type="hidden" name="username" id="username" value="bob" />
<input type="hidden" name="delete_id" id="delete_id" value="45" />
<button type="button" name="btn" class="submitBtn" data-toggle="modal" data-target="#confirm-delete" class="btn btn-xs btn-danger tooltip-error no-border"><i class="fa fa-trash-o bigger-120"></i>Delete</button>
</form>
<form role="form" id="formfield" action="<?=$_SERVER['PHP_SELF']?>" method="post">
<input type="hidden" name="username" id="username" value="tom" />
<input type="hidden" name="delete_id" id="delete_id" value="48" />
<button type="button" name="btn" class="submitBtn" data-toggle="modal" data-target="#confirm-delete" class="btn btn-xs btn-danger tooltip-error no-border"><i class="fa fa-trash-o bigger-120"></i>Delete</button>
</form>
<div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
Confirm Submit
</div>
<div class="modal-body">
Are you sure you want to delete <span id="deletename_id"></span>?
</div>
<div class="modal-footer">
<button type="button" id="cancel" class="btn btn-default success" data-dismiss="modal">Cancel</button>
Delete
</div>
</div>
</div>
</div>
If you want to make javascript unique then you need to think a bit dynamic like giving id in such a way that you can get different field data from different form with just changing a character while getting data.
What i want to mean is that as you can see in my code that I have appended '_1' and '_2' after your id's 'username' and 'delete_id'. Also I have used an advanced way of generating bootstrap modal. So that you don't need to write hole code by your self. You can get clear idea of this method from this link.
Now, note that upon clicking the button I have called a method in which i have passed an id. If that id varies then I can get name on that id.
For testing purpose copy past any form and change the digit after '_' in every id to your favourite digit and also put that in brackets after 'deleteForm' function call as a parameter.
function deleteForm(formid) {
var name = $('#username_' + formid).val();
console.log(name);
BootstrapDialog.show({
title: 'Confirm Submit',
message: 'Are you sure you want to delete '+name+' ?',
buttons: [{
label: 'Cancel',
action: function(dialog) {
dialog.close();
}
}, {
label: 'Delete',
cssClass : 'btn btn-danger',
action: function(dialog) {
// Do whatever you want to do here
console.log('Do whatever you want to do here');
dialog.close();
}
}]
});
}
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.7/css/bootstrap-dialog.min.css">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.7/js/bootstrap-dialog.min.js"></script>
<form role="form" id="formfield_1" action="" method="post">
<input type="hidden" name="username" id="username_1" value="bob" />
<input type="hidden" name="delete_id" id="delete_id_1" value="45" />
<button type="button" name="btn" value="Delete" id="submitBtn_1" class="btn btn-xs btn-danger tooltip-error no-border" style="padding:5px; width:30px;height:30px;" onclick="deleteForm(1)" /><i class="fa fa-trash-o bigger-120"></i>
</button>
</form>
<form role="form" id="formfield_2" action="" method="post">
<input type="hidden" name="username" id="username_2" value="tom" />
<input type="hidden" name="delete_id" id="delete_id_2" value="48" />
<button type="button" name="btn" value="Delete" id="submitBtn_2" class="btn btn-xs btn-danger tooltip-error no-border" style="padding:5px; width:30px; height:30px;" onclick="deleteForm(2)" /><i class="fa fa-trash-o bigger-120"></i>
</button>
</form>
I am trying to do a function like I have one input field and two buttons for two different actions but fetch the same input value.
Button 1
<form id="formAddUser" name="search" method="post" action="/maps">
<input id="inputUserName" type="text" placeholder="Pilgrim ID here..." name="pilgrimID" autocomplete="off">
<br>
<br>
<button id="btnSubmit" class="btn btn-info primary" type="submit">Locate Pilgrim</button>
</form>
Button 2
<form id="formAddUser" name="search" method="post" action="/biodata">
<button id="btnSubmit" class="btn btn-info primary" type="submit">View BioData</button>
</form>
I have one text where I take the ID of pilgrim and provide two buttons 'view biodata' and 'view location'
How can I get the input value of one html element to pass to two javascript functions to perform some actions with the inputs?
I've typically put both buttons on the form and used jQuery to attach On Click events to change the action of the form. Try this ...
<form id="formAddUser" name="search" method="post" action="/maps">
<input id="inputUserName" type="text" placeholder="Pilgrim ID here..." name="pilgrimID" autocomplete="off">
<br>
<br>
<button id="btnSubmit1" class="btn btn-info primary" type="submit">Locate Pilgrim</button>
<button id="btnSubmit2" class="btn btn-info primary" type="submit">View BioData</button>
</form>
Then, also add (jQuery must be loaded) ...
$("#btnSubmit1").on('click', function() {
$("#formAddUser").attr("action", "/maps");
});
$("#btnSubmit2").on('click', function() {
$("#formAddUser").attr("action", "/biodata");
});
The default action of the form submit will still operate, with different actions.
First: do you have two buttons with same ID? You need to choose different IDs, like btnLocate and btnBiodata.
Second: put the two buttons inside the same form. Sorry if I wrong, but I understand that you have two forms with same ID (again). So, you need just one form, somethink like this:
<form id="formAddUser" name="search" method="post" action="/maps">
<input id="inputUserName" type="text" placeholder="Pilgrim ID here..." name="pilgrimID" autocomplete="off">
<br>
<br>
<button id="btnLocate" class="btn btn-info primary" type="submit">Locate Pilgrim</button>
<button id="btnBiodata" class="btn btn-info primary" type="submit">View Biodata</button>
</form>
Later, you need to create a JavaScript function. You know how to create? With JavaScript function you can call elements by ID. Example, if I want to change the text of btnLocate:
<script type="text/javascript">
function changeText() {
document.getElementById("btnLocate").innerHTML = New Text;
}
</script>
To add JavaScript on
Now, call the function on the click event of the button, for example:
<button id="btnLocate" class="btn btn-info primary" type="submit" onClick="changeText()">Locate Pilgrim</button>
This is simple example, with ID of element, you can change what you want. If you want to display something on screen, use alert("Text here") inside JavaScript function.
Hope I can help.
Bye,
Pasch.
Put everything in the same form and use the formaction attribute on one or both of the buttons.
formaction overrides the action attribute on the form tag if that particular button is clicked.
I'm on my phone right now, so it's hard to type up an example, but http://www.wufoo.com/html5/attributes/13-formaction.html has some good information.
<form method="post" action="/selector">
<input id="inputUserName" type="text" placeholder="Pilgrim ID here..." name="pilgrimID" autocomplete="off">
<button name="action" value="view-data" class="btn btn-info primary" type="submit">Locate Pilgrim</button>
<button name="action" value="locate" class="btn btn-info primary" type="submit">Locate Pilgrim</button>
</form>
In selector you can figure out what to do using value of the action.
You could combine both buttons and a text input into single form and use JavaScript (via onclick attribute) to change form action based on the button clicked.
<script>
function setMapsAction(){
formAddUser.action = "/maps";
}
function setBioAction(){
formAddUser.action = "/biodata";
}
</script>
<form id="formAddUser" name="search" method="post" action="see-script">
<input id="inputUserName" type="text" placeholder="Pilgrim ID here..." name="pilgrimID" autocomplete="off">
<br>
<br>
<button id="btnSubmitMaps" class="btn btn-info primary" type="submit"
onclick="javascript:setMapsAction()"
>Locate Pilgrim</button>
<button id="btnSubmitBio" class="btn btn-info primary" type="submit"
onclick="javascript:setBioAction()"
>View BioData</button>
</form>