| Index: trunk/extensions/DonationInterface/payflowpro_gateway/forms/TwoStepTwoColumnLetter3.php |
| — | — | @@ -11,6 +11,50 @@ |
| 12 | 12 | |
| 13 | 13 | parent::__construct( $form_data, $form_errors ); |
| 14 | 14 | } |
| | 15 | + |
| | 16 | + public function loadPlaceholders() { |
| | 17 | + global $wgOut; |
| | 18 | + // form placeholder values |
| | 19 | + $first = wfMsg( 'payflowpro_gateway-first' ); |
| | 20 | + $last = wfMsg( 'payflowpro_gateway-last' ); |
| | 21 | + $city = 'City'; |
| | 22 | + $zip = 'Zip Code'; |
| | 23 | + $email = wfMsg( 'payflowpro_gateway-donor-email' ); |
| | 24 | + $js = <<<EOT |
| | 25 | +<script type="text/javascript"> |
| | 26 | +function loadPlaceholders() { |
| | 27 | + var fname = document.getElementById('fname'); |
| | 28 | + var lname = document.getElementById('lname'); |
| | 29 | + var city = document.getElementById('city'); |
| | 30 | + var zip = document.getElementById('zip'); |
| | 31 | + var email = document.getElementById('emailAdd'); |
| | 32 | + var amountOther = document.getElementById('amountOther'); |
| | 33 | + if (fname.value == '') { |
| | 34 | + fname.style.color = '#999999'; |
| | 35 | + fname.value = '$first'; |
| | 36 | + } |
| | 37 | + if (lname.value == '') { |
| | 38 | + lname.style.color = '#999999'; |
| | 39 | + lname.value = '$last'; |
| | 40 | + } |
| | 41 | + if (city.value == '') { |
| | 42 | + lname.style.color = '#999999'; |
| | 43 | + lname.value = '$city'; |
| | 44 | + } |
| | 45 | + if (zip.value == '') { |
| | 46 | + lname.style.color = '#999999'; |
| | 47 | + lname.value = '$zip'; |
| | 48 | + } |
| | 49 | + if (email.value == '') { |
| | 50 | + lname.style.color = '#999999'; |
| | 51 | + lname.value = '$email'; |
| | 52 | + } |
| | 53 | +} |
| | 54 | +addEvent( window, 'load', loadPlaceholders ); |
| | 55 | +</script> |
| | 56 | +EOT; |
| | 57 | + $wgOut->addHeadItem( 'placeholders', $js ); |
| | 58 | + } |
| 15 | 59 | |
| 16 | 60 | public function generateFormStart() { |
| 17 | 61 | global $wgOut, $wgRequest; |
| — | — | @@ -173,7 +217,7 @@ |
| 174 | 218 | $form .= '</tr>'; |
| 175 | 219 | $form .= '<tr>'; |
| 176 | 220 | $form .= '<td class="label">' . Xml::label( wfMsg( 'payflowpro_gateway-billing-address' ), 'street' ) . '</td>'; |
| 177 | | - $form .= '<td>' . Xml::input( 'street', '30', $this->form_data['street'], array( 'type' => 'text', 'maxlength' => '100', 'id' => 'street', 'class' => 'fullwidth' ) ) . |
| | 221 | + $form .= '<td>' . Xml::input( 'street', '30', $this->form_data['street'], array( 'type' => 'text', 'onfocus' => 'clearField( this, \'Street\' )', 'maxlength' => '100', 'id' => 'street', 'class' => 'fullwidth' ) ) . |
| 178 | 222 | '</td>'; |
| 179 | 223 | $form .= '</tr>'; |
| 180 | 224 | |
| — | — | @@ -183,9 +227,9 @@ |
| 184 | 228 | $form .= '</tr>'; |
| 185 | 229 | $form .= '<tr>'; |
| 186 | 230 | $form .= '<td class="label"> </td>'; |
| 187 | | - $form .= '<td>' . Xml::input( 'city', '18', $this->form_data['city'], array( 'type' => 'text', 'maxlength' => '40', 'id' => 'city' ) ) . ' ' . |
| | 231 | + $form .= '<td>' . Xml::input( 'city', '18', $this->form_data['city'], array( 'type' => 'text', 'onfocus' => 'clearField( this, \'City\' )', 'maxlength' => '40', 'id' => 'city' ) ) . ' ' . |
| 188 | 232 | $this->generateStateDropdown() . ' ' . |
| 189 | | - Xml::input( 'zip', '5', $this->form_data['zip'], array( 'type' => 'text', 'maxlength' => '10', 'id' => 'zip' ) ) . |
| | 233 | + Xml::input( 'zip', '5', $this->form_data['zip'], array( 'type' => 'text', 'onfocus' => 'clearField( this, \'Zip Code\' )', 'maxlength' => '10', 'id' => 'zip' ) ) . |
| 190 | 234 | '</td>'; |
| 191 | 235 | $form .= '</tr>'; |
| 192 | 236 | |
| Index: trunk/extensions/DonationInterface/payflowpro_gateway/forms/css/TwoStepTwoColumnLetter3.css |
| — | — | @@ -29,10 +29,10 @@ |
| 30 | 30 | width: 100px; |
| 31 | 31 | } |
| 32 | 32 | input#city { |
| 33 | | - width: 135px; |
| | 33 | + width: 130px; |
| 34 | 34 | } |
| 35 | 35 | input#zip { |
| 36 | | - width: 50px; |
| | 36 | + width: 55px; |
| 37 | 37 | } |
| 38 | 38 | |
| 39 | 39 | .payflow-cc-form-section { |