I have a 'Create Post' button in which a user can use to submit a post. I only want the user to be able to create one post at a time. So the user would have to remove the first post to create another, or they would have to wait for that post to be removed by someone else - which is perfectly acceptable.
Also, I want the button to be disabled when there is already a live post of theirs.
So, basically, what's the best way to attach the state of the button to the state of the post, so that as soon as the post is removed, the button is then enabled.
Thanks.
Fortunately, spacebars makes this really easy to do. Have a look at the "Smarter Attributes" section of this post.
Here is an example:
<template name="post">
<button disabled={{isDisabled}}>Create Post</button>
</template>
Template.post.isDisabled = function () {
return Posts.findOne();
};
In this case the button will be disabled if any posts were found, but you can easily modify that to your specific requirements.
Related
Ok so I have looked everywhere for a solution to this but I can't figure out why this is happening. Logically it makes no sense. I'm not really a coder but I know some basic PHP.
I used the following code to simply move the coupon field in Woo checkout to a different location:
/*** MOVE THE COUPON CODE ***/
remove_action( 'woocommerce_before_checkout_form', 'woocommerce_checkout_coupon_form', 10 );
add_action( 'woocommerce_after_order_notes', 'woocommerce_checkout_coupon_form' );
After this code is added, the "Buy Now" checkout button to finalize the order does nothing on click, like the JS is disabled.
When the code is removed and coupon code goes back to original location, the button works normally.
Has anyone else had this happen to them? It's so bizarre.
You can see the page (with code above implemented) here:
http://insiders.nomadmoguls.com/payment/?add-to-cart=205479&variation_id=205481&attribute_pa_type-of-pass=yearly
Thanks in advance for everyone's help! This was my last resort after several hours looking for a solution on my own!
The issue is caused by the hook you're using, woocommerce_after_order_notes. It's causing the <form name="checkout"> to close before the Submit button, so the Sign Up Now button isn't actually inside that form anymore, so it can't submit it when it's clicked, since your (paraphrased) markup is like this:
<form name="checkout">
<!-- coupon code stuff -->
</form>
<button type="submit">Sign Up Now</button>
Check out this video of me on the site with Dev Tools open. You can see the Sign Up Now button outside the Checkout form - as soon as I drag it up to be inside the form, it works just fine.
A relatively common misconception is that "Coupon Code" is a checkout form field, when it's really it's own separate form, so of course - it doesn't want to be nested directly inside the checkout form (you can't have forms inside forms).
This means you have real two options, without doing something crazy like rebinding a click handler on the submit button to submit the form:
Use a hook that comes after the checkout form, such as woocommerce_after_checkout_form instead of woocommerce_after_order_notes.
Keep the coupon form at its original location.
I'm observing very similar behavior for both {$taxonomy}_add_form_fields and {$taxonomy}_add_form is there a diference and what it is? I understand the semantic difference of form and form field, but I'm wondering how WP sees it.
There is no record of it in the Wordpress Codex and Developer part of the Wordpress website is giving almost same description.
See for yourself:
https://developer.wordpress.org/reference/hooks/taxonomy_add_form_fields/
https://developer.wordpress.org/reference/hooks/taxonomy_add_form/
Taking a look into /wp-admin/edit-tags.php, we can see the do_action( "{$taxonomy}_add_form", $taxonomy ); is used to replace to preceding deprecated filters. That's why it was added.
Getting to the "difference" between them, you could see in the code that the filter {$taxonomy}_add_form_fields is used to add data to the form just before the submit button has been created, while the other filter {$taxonomy}_add_form is used after the submit button (but still before the closing tag </form>.
Usually, you could think about putting visible fields before the submit button and then adding hidden fields right after it. But it's not a sort of great difference between them.
Both of actions is in the form tag.
But, {$taxonomy}_add_form_fields action is before submit button and "{$taxonomy}_add_form" action is after submit button and add_tag_form action.
I have two questions, both related to the same view: so there is view called ProductDetails which shows the details of a product.
Each product can have the status:
Available - in this case, two button are available "edit" and "remove"(which will change the status of the product to "Not available" but will not remove it from DB)
Not available - in this case, the page displays the product but no options to edit or remove are
visible.
The controller ProductsController has an action Details that shows that view.
The problem is that I don't know how to implement the two buttons (Edit and Remove) because:
Edit sends to another action method (Edit which display another view) <- this works
Remove should do (IMO) a post on the current page. In the post action, the status of the product is changed and the view is shown again.
I want both button to look like links. If I put a form for remove, then it will be displayed as a button. I would like to avoid making the button look like a link with css. Or... at least I want to use the same HTML element for both 'buttons'.
This is more an issue of displaying the elements so I have added the CSS tag to your question as some alternative answers may rely on this.
Personally I think trying to make a button look like a text link would be quite awkward, even once you turn off the border and background you have issues with lining up the text etc.
I'd say you have 2 "simple" options.
Firstly you could make the delete not post a delete request but link to a delete confirmation page (or bring up a JS modal window with your delete form and button).
Secondly you could make them both look like buttons, while you requested that it looks like a link I figured that the main point was consistency in UI than the link look specifically. You could use JQueryUI and invoke .button() on both elements, invoking JQueryUI for 1 feature is a bit overkill but it's a quick change, of course you could replicate the same idea of styling the link like the buttons but would have to spend time dealing with browser CSS issues.
the Remove link should post to the Remove action, which should in turn (after validation and DB update) redirect to the details action.
public ActionResult Details(int productId)
{
// Your current action method
return View(model);
}
public ActionResult Remove(int productId)
{
// Validate productId
// Update DB
return RedirectToAction("Details", new { productId = productId } );
}
You easily can solve your link vs button problem by using a GET instead of a POST. Don't be blinded by best practices.
Or you can use a Remove link that executes a one-liner Javascript function that posts the form:
Remove
I am trying to refresh a sidebar.php in wordpress on a form submit (that is in a widget on the sidebar.php).
I have video on the page and if the entire page refreshes, the video has to play from the beginning.
I need a solution to simply refresh the sidebar.php when someone submits the form ... I am not an expert php programmer so simple is best!
btw. I am using formidable plugin for the form.
thanks in advance!
Sounds like a job for ajax!
Now, you could do it from scratch, but that would be unnecessarily painful. Instead, I recommend including jquery into your page by adding this into your header
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
(which uses the latest version, which is hosted on google)
Now that you have jquery loaded, there are many easy ways to submit your data without interrupting the flow of things. Here is how I would do it (I am assuming that you are using method="post"):
Change your <input type="submit" > into a <button>, so clicking on it doesn't trigger the built-in form submit (which would interrupt your video).
Set the id attribute of your button to something so that you can reference it easily like <button id="mysubmitbutton">. (While you are at it, give id attributes to all the form fields you care about if you have not already so that you can reference them easily as well, like <input type="text" name="firstName" id="firstName"> instead of just <input type="text" name="firstName">)
Inside the <head> portion of your website, add some code that looks like something like this:
<script type="text/javascript">
//makes it so that it goes after the html document is ready for it
$(document).ready(function() {
//this ties a onclick event to your button you made
$("#mysubmitbutton").click(function(){
//when the button is clicked, it will asychronously post to where you want it to
$.post("urlthatwasinyouractionequalsattribute.php",
{
//put all your post variables here, referencing the ids you made earlier
firstName: $("#firstName").val(),
time: $("#time").val() //be sure you don't have a trailing comma on the last one
},
function(data) {
//data is whatever the other website sends back. do whatever you want here...
alert("Result: " + data);
});
});
});
</script>
Fire it up and it should work. Obviously, you will need to change the values so that it matches your form, etc.
Hope that helps! Please mark as answer if it did.
I am using asp.net and I need to display a prompt to the user if they have made changes to the web page, and they accidentally close down the browser.
The page could be anything from "Edit Profile" to a "Submit a Claim" etc.
How can I can display the messagebox, ensuring that it is displayed only if changes have been made (as opposed to, the user making changes, then undo-ing the changes, and shutting down the browser)
What I have done in the past is use some client side scripting which does this check during the onbeforeunload event....
var showPrompt=true;
var isDirty=false;
var hidePopup=false;
function onBeforeUnload() {
if (showPrompt) {
if (isDirty) {
if (hidePopup || confirm("Click ok to save your changes or click cancel to discard your changes.")) {
doSave();
}
}
}
showPrompt = true;
hidePopup = false;
}
ShowPrompt can be set to false when your clicking on an anchor tag which won't navigate you away from the page. For example <a onclick='showPrompt=false' href='javascript:doX()'/>
isDirty can be used to track when you need to save something. You could for example do something like $("input").onchange(function(){isDirty=true;}); To track undo's you might want to replace isDirty with a function which checks the current state from the last saved state.
HidePopup lets us force a save without confirming to the user.
That's very difficult to even touch without understanding what's on the page. If it's a few controls you capture value at page load and store them so you can later compare. If it's a complex page you'd need to do an exact comparison to the entire viewstate.
Typically you'd handle this type of situation by setting a boolean to TRUE the first time any change is made and disregard the user changing it back. If you're just trying to avoid accidential non-save of data the user should be smart enough to know they've "undone" their changes.
You can do this with javascript. See this question and either of the first two answers.