Wellington Avelino
Wellington Avelino

Reputation: 199

Edit formatting parameters passed by the URL CakePHP 3

I have a form with a single field, na input type = "text" when the form is submitted an URL is as follows:

http://localhost:8765/products/search?search=notebook

I wish it gets up in the following way when subjected to the form:

http://localhost:8765/products/search/notebook

Typing the URL up manually it works perfectly (I created a method that is able to get the contents after search/, also created a route specifies to have a URL above).

Route Code (routes.php):

$routes->connect('/products/search/:search', ['controller' => 'Products', 'action' => 'search'], 
[':search' => '\w+', 'pass' => ['search']]); 

ProductsController.php Code (method responsible for action search)

public function search($search) 
{ 
if($this->request->is('get')) 
{ 
//$product = $this->request->params['pass']; 
$this->paginate = [ 
'fields' => ['product_name', 'quantity', 'sold', 'description', 'price', 'old_price', 'thumbnail'], 
'conditions' => ['product_name LIKE' => '%'.$search.'%'], 
'order' => ['price' => 'DESC'], 
'limit' => 3 
]; 

$this->set('products', $this->paginate($this->Products)); 
} 
} 

form Code:

<?= $this->Form->create(null, ['url' => ['controller' => 'Products', 'action' => 'search'], 'type' => 'get', 'id' => 'search-form', 'class' => 'navbar-form span7 text-center']) ?> 
<button class="btn btn-info" title="Favorite o Site"> 
<span class="glyphicon glyphicon-star"></span> 
</button> 
<?= $this->Form->text('search', ['class' => 'form-control', 'placeholder' => 'Search']) ?> 
<?= $this->Form->button('Buscar <span class="glyphicon glyphicon-search"></span>', ['type' => 'submit', 'class' => 'btn btn-default']) ?> 
<?= $this->Form->end() ?> 

OBS1: I imagine that the change should be made in this form (Just a guess).

Upvotes: 1

Views: 784

Answers (2)

Ricardo
Ricardo

Reputation: 699

I used the jQuery lib to when the form is submitted suppress the default behavior, create a new url and make the redirection:

$("#search-form").submit(function(event){
    event.preventDefault(); // suppress default behavior
    action = $(this).attr('action') + '/' + document.getElementById('search').value; // create a new urldesejado
    window.location.href = action; //make the redirection
});

Upvotes: 2

AD7six
AD7six

Reputation: 66227

There are two basic solutions

Use Js

You can use js to change the url the form submits to:

<form 
    method="GET" 
    action="/base/url/" 
    onsubmit="document.location=this.action+document.getElementById('search-input-id').value; return false;"
>
  <input id="search-input" />
</form>

This is very simple and has no server side logic.

Use Post-Redirect-Get

Alternatively, submit the form via post, and redirect the user to the appropriate url to see the results (A pattern known as PRG).

E.g.:

<form method="POST">
  <input name="search-input" id="search-input" />
</form>

With an appropriate controller action:

public function search($search = null) 
{
    if($this->request->is('post')) {
        $term = $this->request->data['search-item'];
        // Any verification/validation/logic required
        // Redirect to same controller action with this search term
        return $this->redirect([$term]); 
    }
    ...
    // GET request, with $search term

The advantage of this technique is having a means to control/verify/validate the search term is valid before sending the user to the results page url.

Upvotes: 4

Related Questions