I am currently scraping a website running BigCommerce.
The variations have dropdown boxes, when the end user changes one of the select boxs the product information changes, the URL doesn't change.
When the select box is changed it POSTS the product ID and Variant ID, the page is then updated.
How can I mimic this select box change? I have tried to replicate the POST but I get a security token error as I suspect it's blocking cross domain scripting.
The page URL doesn't update so I can't even loop through pages, the form code is here
<div class="productView-options-wrap" data-product-option-change="" style="">
<div class="productView-options-inner">
<div class="form-field" data-product-attribute="set-select">
<label class="form-label form-label--alternate form-label--inlineSmall" for="attribute_select_176">
Color: <small>Required</small>
</label>
<select class="form-select form-select--small" name="attribute[176]" id="attribute_select_176" required="">
<option value="">View Options</option>
<option data-product-attribute-value="1126" value="1126">1 Standard (Most Popular)</option>
<option data-product-attribute-value="1127" value="1127">1 Standard</option>
</select>
</div>
</div>
</div>
<div class="form-field form-field--increments">
<label class="form-label form-label--alternate" for="qty[]">
Quantity:
</label>
<div class="form-increment" data-quantity-change="">
<input class="form-input form-input--incrementTotal" id="qty[]" name="qty[]" type="tel" value="1" data-quantity-min="1" data-quantity-max="0" min="1" pattern="[0-9]*" aria-live="polite">
</div>
</div>
<div class="form-action">
<input id="form-action-addToCart" data-wait-message="Adding to cart…" class="button button--primary" type="submit" value="Add to Cart">
</div>
The ajax being called is
var formData = {
"action": "add",
"attribute[176]": "1130",
"product_id": "931",
"qty[]": "1"
};
$.post('https://example.com/remote/v1/product-attributes/931', formData)
.done (showResult)
.fail(showError);
Thanks
There are 2 ways you can go about doing this.
You can use the V3 API, fetch all of the products, including their variants. You can use that data to hit the Product/Variant Options Endpoint, where you'll be able to read all the options metadata. You will be able to manually re-construct the HTML that way - although it's really not ideal.
An alternative would be to determine the SKU of each product variant, and append that as a query parameter to the product page URL.
If you include the SKU as a query parameter to the product page, it will render out the pre-selected option configurations.
I'm a bit confused as to what you're trying to accomplish with the scraped data? If you're going to be performing actions on it, you'll likely run into further CORS issues.
I ended up re-writing this using use Symfony DomCrawler and Guzzle
I was able to save the security token and submit with the ajax call and process the data that way. 700+ products in around 10 minutes.
Related
I am working on customizing a plugin, however my knowledge is currently lacking on the php side.
currently i have an Ad plugin in which you can sell ads per day, however my predicament is that i want to sell the ads only in packs of 30,60 & 90 days.
In this plugin upon typing a number of days this plugin calculates the amount and gives a result right under without anything pressed, so it is actively reading an input; however the only problem with this plugin is that it allows anyone to type a random number in there.
now the only real solution that i could think of was to make a drop-down with pre-existing values 30, 60, 90
My attempts thus far have been futile as i keep applying HTML <Select> (yes i had changed the wording from <input to <select and then added <option value="value">value wording</option>)techniques and it seems that anytime that i attempt to put a number for the value as one of the choices i get nothing but an empty drop-down, this then made sense to me since this is a PHP form and not an HTML form.
I was able to find where to code the changes, as i was able to find where the field is pulling from; here is the code:
(How should i proceed to make the changes that i want happen?)
<div class="control-group" id="total_days" style="<?php echo $date_dis;?>">
<label class="ad-price-lable control-label" width="40%"><div id="total_days_label"><?php JText::_("TOTAL_DAYS_FOR_RENEWAL");?>:</div> </label>
<div class="controls">
<input type="text" maxlength="5" name="totaldays" class="ad-pricing" id="totaldays" value="<?php echo $ad_totaldays ;?>" onchange="caltotal()" >
<input type="hidden" name="ad_totaldays" id="ad_totaldays" value="<?php echo $ad_totaldays;?>" />
</div>
</div>
now i am also assuming that out of this area, the main thing to be changed would be:
<input type="text" maxlength="5" name="totaldays" class="ad-pricing" id="totaldays" value="<?php echo $ad_totaldays ;?>" onchange="caltotal()" >
of course, i could be wrong, but i really would appreciate help with this!
thank you very much!
Here is how I've always done dropdowns
<select form="examplef">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
<form id="examplef">
<input type="submit">
</form>
The php you're looking at is setting a value field for the inputs. This just means that something will be in the box already when you load the page.
Also keep in mind that just because you have predefined options doesn't mean you wont get unexpected input; Changing the options is as easy as right clicking
PHP form vs HTML form
They are the same. The html <form> tag is a way to communicate with php. This tag will (most likely) have an attribute called "action" and "method". The action attribute specifies what to do with the collected information. You can think of it almost as an <a href> that includes data.
The method attribute is a little more complicated. It tells your browser how to send the data entered into the form. The two options are "GET" and "POST". the GET method is data put in the url. I'm sure you've seen youtube links with the ?id=. This is just a GET variable included in the URL. The POST method is for secure data, or data that shouldnt be in the URL. If you would like to read more, W3Schools has a great document here or from Php here and here
I have a simple form with two slider and two buttons created using links, because truthfully those links are images created with css.
So, I want to be able to send all slider values when you click the button and then retrieve those values in the second div to show it.
I want to do it using PHP, so I think the best way is to send over POST and then retrieve it using the same way.
</br></br></br>
<div class="main">
<form method="post" action="">
<input type="range" name="val1" id="val1" value="5" min="0" max="10" data-show-value="true"></br>
<input type="range" name="val2" id="val2" value="5" min="0" max="10" data-show-value="true">
</br>
</form>
</div>
<a class="btn1" href="#">Button 1 - View 1 (Sliders)</a></br>
<a class="btn2" href="#">Button 2 - View 2 (Results)</a>
<div class="second">
<p>--Second div---</p>
<p>--Value 1---</p>
<?php $_POST['val1'] ?>
<p>--Value 2---</p>
<?php $_POST['val2'] ?>
</div>
At first I want to know how to pass values between pages and then when you come back to the main view put the value selected before. I think this can be done using $_SESSION.
So, what do you suggest to get the values from the each slider and put it in the second div using PHP?
I want to develop a dynamic site when depends on the button that you click go to one page or another. I have nearly 20 possibilities depends on the button clicked, so I think that the best way is using divs and putting all the PHP and HTML code in a file and show or hide depends on the button that you click.
And I using bootstrap-slider library, but to do the example I used the jquery slider.
I've done a fiddle to see if someone is able to do it.
https://jsfiddle.net/dperezq/ph7mfu0v/
CMF MODX revolution
There is a template with a form
<form action="http://localhost/index.php?id=3" method="post">
<input type="name" name="name">
<input type="search" placeholder="Все товары" name="search_bar">
<input type="submit" value="">
<div style="clear: both;"></div>
</form>
which call a snippet which contains debugging line:
echo '|||||||||||| ', $_POST['search_bar'];
The problem.
If I put a value into search bar - echo will not show anything. But if I save the template
before I putt the value into the search bar and click submit button, then echo display right value from the search bar
Suppose the problem is in caching. But I cleaned it and it is cancelled everywhere (at least I think so, exploring administrator panel).
For Snippets that depend on user input (like a search query) you will want to call them uncached: [[!mySnippet]]
However if you want to gain a bit of performance you can wrap the Snippet call with Jason Coward's getCache, and by default it caches to a unique cache key based on the $_GET parameters. In other words, each search query would get its own cache object. This helps when there are repeat searches for the same string.
So you can check out the search on my site at http://www.CyberBytesInc.com it's working just fine at the moment. What I am trying to do though is I have a search parameter dropdown next to the search, one "Search Entire Site" and the other "Search Blog". I am using Google Custom Search so to search just my blog all I need to have before the search term is "site:cyberbytesinc.com/blog/" aka, the value of the dropdown.
Here's the HTML:
<div id="search" class="hidden">
<form method="get" action="/search" class="row no-p-mobile">
<select id="search-parameter" name="parameter">
<option value="">Search Entire Site</option>
<option value="site:cyberbytesinc.com/blog/">Search Blog</option>
</select>
<input id="search-field" name="q" type="search" placeholder="Enter to Search"/>
<span class="visible-desktop"><input class="red-btn" type="submit" value="Search ›"></span>
<!-- x-webkit-speech -->
</form>
</div>
Pretty much if they leave it on "Search Entire Site" which is the default, then I want it to do just as it already does, so I have the value set to nothing. But if they select "Search Blog" then I want them to type in their search query next to it, and upon hitting enter, it would just take the value of the option they selected and throw it into the URL right before their search term, so it would go from:
.com/search?q=example
to
.com/search?q=site:cyberbytesinc.com/blog/%20example
I know this has to be very straightforward, I am just pretty new with all of this and have spent a bit trying to figure it out on my own and I'm at the point where I could just use some quick help!
Thanks so much guys/gals (:
EDIT (I'm VERY Close now, Just Need A Little Help):
I have tried numerous things, for instance, naming both the option and the textfield the same name, e.g. "q" and I have managed the url to become this when searching just the blog:
.com/search?q=site%3Acyberbytesinc.com%2Fblog%2F+&q=example
So it's actually pulling in the proper things into the URL when selecting just the blog in the dropdown. The problem is, Google Custom Search is again just recognizing the last
"q=example"
and ignores the first
"q=site%3Acyberbytesinc.com%2Fblog%2F"
even though there is a + inbetween the two.
If I could somehow get the term to carry over and not have the second "q=" then it would work, because it works perfectly if you just go in and remove the second "q=" in the URL structure it makes.
You're going to need to change this:
<div id="search" class="hidden-desktop">
<ul class="row no-p-mobile p-top-10 p-bottom-10">
<li>
<select id="search-parameter" name="parameter">
<option value="">Search Entire Site</option>
<option value="site:www.cyberbytesinc.com/blog/%20">Search Blog</option>
</select>
</li>
<li><form method="get" action="/search"><input id="search-field" type="search" name="q"/></form></li>
</ul>
</div>
to this
<div id="search" class="hidden-desktop">
<ul class="row no-p-mobile p-top-10 p-bottom-10">
<li>
</li>
<li><form method="get" action="/search"><input id="search-field" type="search" name="q"/>
<select id="search-parameter" name="parameter">
<option value="">Search Entire Site</option>
<option value="site:www.cyberbytesinc.com/blog/%20">Search Blog</option>
</select>
</form></li>
</ul>
</div>
You need to make sure the select element is inside the form element so that it's associated appropriately, as that form element will define how and what is sent to the server. That'll automagically put the value of the select in the URL query string and the rest is all up to you.
I'm making a social network type site, where users can upload their items to be rated. However, I'm trying to improve the way the site is laid out, so want to automatically generate pages once the user inserts a new item. The add.php page has the following form:
<form action="add.php" method="post" autocomplete="on" enctype="multipart/form-data" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="POST" id="pic">
<p> <label for="jname" class="iconic user"> Name of Jam <span class="required">*</span></label> <input type="text" name="jname" id="jname" value="<?php if (isset($_POST['jname'])) echo $_POST['jname']; ?>" required="required" placeholder="Input your Name of Jam here" /> </p>
<p> <select name="jtype" id="jtype" value="<?php if (isset($_POST['jtype'])) echo $_POST['jtype']; ?>" required="required">
<option value="jam">Jam</option>
<option value="jelly">Jelly</option>
<option value="marmalade">Marmalade</option>
<option value="preserve">Preserve</option>
</select> </p>
<p> <label for="producer" class="iconic user"> Jam Producer <span class="required">*</span></label> <input type="text" name="producer" id="producer" value="<?php if (isset($_POST['producer'])) echo $_POST['producer']; ?>" required="required" placeholder="Input the producer of the Jam here" /> </p>
Upload a picture of your jam: </br> </br> <input name="userfile" type="file" /> </br>
<input type="submit" name="submit" value="Register" />
<input type="hidden" name="submitted" value="TRUE" />
</form>
When the form is submitted, I then want it to generate a new page for that new user created item. Is there a fairly simple way of doing this?
Cheers
You don't have to actually 'create' new html page for each item.
You could save this information to database (mysql for example).
Then you could create another php file, say 'item.php' and access different entries from mysql database like so:
item.php?id=1
This generally isn't the way such sites are created. (i.e.: You don't generate the physical pages themselves at the point of form submission.) Instead, you'd usually store the form data in a database and then retrieve/display it based on the URL - either by decoding the URL itself via a "controller" or by using a query string variable such as ?producerid=x. This data would then be used to populate a template.
To be honest, I'd really recommend getting hold of a recent PHP book (as far as database access is concerned, you should be using PDO or MySQLi) or following some online tutorials - whilst it might initially seem like this won't be a meaningful form of progress, its likely to pay substantial dividends in the long run.
The best and efficient way to do it is to store the data in a database and retrieve it whenever user clicks on specific item. One thing though, if part of your plan is to make your site accessible by google search engine, you have to generate the individual web pages... because, google is only a web crawler...it cant get into mysql or other databases.
Usually there's no new page generation for things like that. You should create a template and load dynamic informations from other sources (such an XML file or a database) to it so that it seems a completely new page.
Just:
See what each item page has in common
Define a template which contains the common code
Retrieve dynamic informations (item infos for example) from a database
Use PHP embedded in HTML to load dynamic HTML
An example:
Facebook does not create a new page per each user registration. There's an HTML template which defines the position of the profile photo, the position and style of the posts, the position and style of the friend list and stuff common to any profile page, and then just load different informations when you call such a page for Mark, Frank, Jeff and so on.