xanda

Hello Fahad,

thanks for getting back to me, by the time you know that there is no issue with the plugin itself then i’ll check your solution.

Many thanks

Hey qtwrk,

Thanks for getting back to me ! I’ve raised a ticket on the link you sent me.

Just to clarify you’ve never had that issue before ?

Many Thanks

Also perhaps relevant, I’ve just noticed that the JSON failure response includes ‘spam: true’.

Is there anything here that might be triggering the spam detection?

For reference, here’s the form:

https://www.themanufacturer.com/eventsites/awards2014/Entry-Form/

I’ve removed the word ‘Class’ from the ‘World Class Manufacturing Award’, so it will submit successfully if that category is selected.

Here’s an example request that fails:

POST https://www.themanufacturer.com/eventsites/awards2014/Entry-Form/

Request headers:

Host: www.themanufacturer.com
User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; rv:31.0) Gecko/20100101 Firefox/31.0
Accept: application/json, text/javascript, */*; q=0.01
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
X-Requested-With: XMLHttpRequest
Pragma: no-cache
Cache-Control: no-cache
Referer: https://www.themanufacturer.com/eventsites/awards2014/Entry-Form/
Content-Length: 494
Cookie:
Connection: keep-alive

Request body:

wpcf7=224046&_wpcf7_version=3.9.1&_wpcf7_locale=&_wpcf7_unit_tag=wpcf7-f224046-o1&_wpnonce=1917bd35ef&hidden-519=The+Manufacturer+of+the+Year+Awards+2014&post_title=The+Manufacturer+of+the+Year+Awards+2014&category=World+Class+Manufacturing+Award&first-name=1&last-name=1&job-title=1&company-name=1&addressline1=1&addressline2=&addressline3=&city=1&county=&postcode=1&telephone=1&[email protected]&no-employees=1&no-employees-uk=1&turnover=1&hear-about-us=Awards+website&other=&_wpcf7_is_ajax_call=1

And here’s an example that succeeds (only changing ‘Class’ for ‘Awesome’ in the value of ‘category’ in the request body):

POST https://www.themanufacturer.com/eventsites/awards2014/Entry-Form/

Request headers:

Host: www.themanufacturer.com
User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; rv:31.0) Gecko/20100101 Firefox/31.0
Accept: application/json, text/javascript, */*; q=0.01
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
X-Requested-With: XMLHttpRequest
Pragma: no-cache
Cache-Control: no-cache
Referer: https://www.themanufacturer.com/eventsites/awards2014/Entry-Form/
Content-Length: 494
Cookie:
Connection: keep-alive

Request body:

wpcf7=224046&_wpcf7_version=3.9.1&_wpcf7_locale=&_wpcf7_unit_tag=wpcf7-f224046-o1&_wpnonce=1917bd35ef&hidden-519=The+Manufacturer+of+the+Year+Awards+2014&post_title=The+Manufacturer+of+the+Year+Awards+2014&category=World+Awesome+Manufacturing+Award&first-name=1&last-name=1&job-title=1&company-name=1&addressline1=1&addressline2=&addressline3=&city=1&county=&postcode=1&telephone=1&[email protected]&no-employees=1&no-employees-uk=1&turnover=1&hear-about-us=Awards+website&other=&_wpcf7_is_ajax_call=1

Hi showe,

It looks like your three .one_third divs are all floated left, so the paragraph which wraps your textarea and submit button is sitting up and over them.

Quickest fix might be to wrap your three .one_third divs in a .row with clear:both;

<div class="row">
  <div class="one_third">...</div>
  <div class="one_third">...</div>
  <div class="one_third last">...</div>
</div>

.row{
  clear:both;
}

If you look at your style.css, around line 206, the ‘big’ styling rules are only selecting input[type=”text”], textarea, input#s and input[type=”password”]:

input[type="text"], textarea, input#s, input[type="password"] {
    background: none repeat scroll 0px 0px #EDEDED;
    border-radius: 5px;
    font-size: 14px;
    padding: 10px 7px;
    width: 98%;
    border-width: 1px;
    border-style: solid;
    border-color: #999 #FFF #FFF #999;
}

If you add each of the other input types you’re using to that list, they will all get the same wide/grey-background styles:

input[type="date"],input[type="email"],input[type="file"],select

You might want to add this and any other theme-based adjustments to a child theme.

Two quick changes should fix this: close the ol and add a margin.

CF7 markup:

<ol class="singleline">
  <li> <label for="cf7-phone">Phone</label> [text cf7-phone 15/]</li>
  <li> <label for="cf7-mobile">Mobile</label> [text cf7-mobile 15/]</li>
</ol>

[textarea Message id:Message]

[submit]

CSS:

.wpcf7-form .singleline ol {
  list-style: none;
  margin: 0 0 10px; /* added bottom margin to ordered list */
}

.wpcf7-form .singleline li{
  display: inline-block;
  margin-right: 10px;
  padding-right: 10px;
}

Are you happy editing or adding some css?

If you add these lines, they should do the trick – targeting the different form fields, setting max-width so that they don’t overflow their container, and setting box-sizing so that their padding and borders sit inside that constraint aswell.

input[type="text"],
input[type="email"],
input.text,
input.title,
textarea,
select{
  max-width: 100%;
  box-sizing: border-box;
}