QuickForm can be applied in a variety of web development cases. In this example, consider the situation of using dynamic goods for sale, that is, work in the shop mode with the goods, the price of which is formed by the selection of characteristics.

On this page we will display two products, each of which is a separate component project. And also the module mod_quickform, started in the basket mode. We will use com_content as the base component. Below, I'll try to describe some subtleties and settings, but for now consider an example.

Return to the page QuickForm 2

empty cart
Case ATX ACCORD P-28B (1 390 rub.)
0rub.


Lunch CAPRICE
Composition (1020 g): Roll Baked Salmon, California Roll Tempura, Roll Tory Teriyaki, Roll Murakami.
0rub.





Now, as I promised, consider some points that can cause difficulties in setting up the basket. To begin with, we note that the product itself is simply a component project, here we will not dwell on it. The only difference is that instead of the submit button, you need to use the addToCart button from the menu set. In addition, you need to publish the mod_quickform module in the recycle bin mode. The store is ready.

1. All store basket settings are in the global configuration of the component, but some require differences for different projects and are specified in the project settings. For example, the product picture in the shopping cart window is located here.




2. The css file of the recycle bin lies in the /modules/mod_quickform/css/cart_default.css folder. Do not make edits directly to this file. Create a new one next to it with a new name, copy the styles to this file. In the mod_quickform module settings, mark the new file as working. Edit the styles so that they match the design of your site.


3. Consider the global settings of the basket. They are broken into several parts and we will try to find out what is here and what for.



3.1). The mod_quickform module settings are the first.

3.1.1). First comes a setting that determines which side of the price the text from the second setting will be displayed - before the price or after.

3.1.2). The second setting is the text itself. At me this value is equal "products:". Here we need to describe a little bit more.

Since QuickForm creates dynamic forms with the most diverse configuration, the product can have several prices, and in different "currency" (pieces, percent, amperes, etc.). It is not always possible to calculate the total amount. If you have such a case, this does not mean that everything will break down and will not work. But instead of the amount, the quantity of goods in the basket will be displayed. For this, in fact, this setting was created. If it hinders you, leave the field blank.

3.1.3). The last "img:" setting points to a picture with a basket icon. Here everything is clear.


3.2). The settings of the basket itself.



3.2.1). The first three fields of type "textarea" are intended for html output in different parts of the basket. Accordingly, at the top, in the middle and below.

3.2.2). The next three fields in which I have inserted id projects are more interesting, and it's worth writing about them in more detail. They are designed to output additional forms at the bottom of the basket, such as the delivery method, payment or something like that. They are not required. The first two of them are displayed at the bottom of the basket, the third field is displayed in a separate pop-up window. To see how this works, you can use the example of the page you are reading.

The forms that are used for output can be dynamic and can include a calculator (CalculatorSum). These forms should not have submit buttons.

On an example of a current page, it is possible to disassemble some details. In the lower left part of the basket you can see the headers "Delivery method", "Payment method", these headings are the project titles, they will be displayed if the title is displayed in the project configuration.

In the right part, under the heading "ORDER COSTS", the "Final price:" and additional lines with intermediate amounts are displayed. In the event that the subform includes a calculator. The "Delivery" subtitle is a label from the settings of the calculatorSum field.

In this example, you can see that if you select "Payment method" -> "prepay by bank card" we have an additional "discount" line. This is because the field calculatorSum in this form is enabled dynamically.

"Currency" is also defined in the calculatorSum settings. In this regard, it should be noted that all "currencies" should be the same, for example, "rub." and "rub" are different currencies for the component, he will calculate them separately and show two amounts in two currencies.

3.2.3). The next four fields are text constants. You can leave them as is, remove or enter your own values.

3.2.4). The last "redirect" field allows you to enter a link. where the user will be redirected after confirming the purchase. If it is empty, then the user will be redirected to the current page.


3.3). In conclusion, consider the last part of the interface - the settings for email.



3.3.1). The first two fields are for html output at the beginning and end of the letter.

3.3.2). The next field "Record history", indicates what you need to do with the history of the basket items - write it down or do not write it down.

3.3.3). The "email" field and the "subject line" field can be left blank if they do not say anything to you.

3.3.4). The last field "message after sending" contains the text that will be shown on the page of the site in its interface system messages. This field should not be ignored.


Add a comment.

Add comment