Getting unwanted "submit query" button on form

[eluser]bazianm[/eluser]
Hi,

I am still new to CodeIgniter so please forgive me if this is a stupid question.

I created a view which is intended to insert a popup form based on jqModal. The form works fine when I created it in a test environment but, when I integrate it into the CodeIgniter based app I am getting some weird results. It seems like a "submit query" button is being added and I know I didn't do it.

Here's the code (I removed some of the extraneous code from it for brevity)

Code:

<div id="ex3a" class="jqmDialog">
<div class="jqmdTL"><div class="jqmdTR"><div class="jqmdTC jqDrag">Please enter your filter criteria</div></div></div>
<div class="jqmdBL"><div class="jqmdBR"><div class="jqmdBC">

<div class="jqmdMSG">

&lt;form name="frmFilters"&gt;
<table>
<tr>
  <td>Job</td>
  <td><select name='cboJobs'><option value=""></option>
  &lt;?PHP
  /* snip... ghenerate the options */
  ?&gt;
  </select>
  </td>
</tr>

<tr>
  <td>State</td>
  <td><select name="cboStates"><option value=""></option>
  &lt;?PHP
  /* snip... generate the options */
  ?&gt;
  </select>
  </td>
</tr>

<tr>
  <td>Store</td>
  <td>&lt;input type="text" name="txtStoreId"&gt; </td>
</tr>

<tr><td></td><td>&lt;Input type="button" value="Clear"&gt;Input type="button" value="Save" onClick="SaveClicked()"></td></tr>
</table>
&lt;/form&gt;
</div>

Is there something I need to do to not have CodeIgniter add that extraneous button to the header of the dialog?

Thanks in advance for any assistance you can offer.

[eluser]CroNiX[/eluser]
Edit: It's not a CI problem. You're "save" button doesn't have a start tag.

[eluser]bazianm[/eluser]
Maybe I am misunderstanding what you are saying but if you are saying I do not have the <input tag for the save button, i do.

Code:

<Input type="button" value="Clear">
<Input type="button" value="Save">

That's the same code as in my original post, just formatted for easier reading...

Did I misunderstand what you meant? If I did, I apologize...

[eluser]CroNiX[/eluser]
This is copied from your first post and is missing the opening "<" for the "save" button:

Code:

<Input type="button" value="Clear">Input type="button" value="Save" onClick="SaveClicked()">
                                   ^

[eluser]Glazz[/eluser]
What CroNiX said was that

Code:

<tr><td></td><td>&lt;Input type="button" value="Clear"&gt;Input type="button" value="Save" onClick="SaveClicked()"></td></tr>

You have a missing < for the second input..

But regarding your problem, i don't see anything weird that causes that you.. but are you closing all that divs you are opening?

I only see one div close ( </div> ) at the end..

[eluser]bazianm[/eluser]
I can post the entire code here. I double checked all the divs and they are all closed properly. Besides, it would seem to me that CI has to bee adding it because when I run the dialog in a standalone .php file, it doesn't happen. It only happens when running within the framework.

[eluser]Glazz[/eluser]
How can CI add buttons ?
CI only does what you ask him to do.

You are maybe doing something wrong, or applying a CI function wrong.

Post the controller and view here, or post the website if possible so we can take a look at it.

[eluser]bazianm[/eluser]
First of all, I agree that I must be doing something wrong. I just can't figure out what.

I can't really post a page yet but I can (and have) posted screen shots of the dialog box. Here they are:

The Dialog in the test environment:
http://www.rdiaudit.com/NonCIVersion.png

Dialog in CI
http://www.rdiaudit.com/CIVersion.png

As you can see, the issue is placement of the close button. The "Submit Query" seems to be some text (it is not a button of its own) that is being added to the close button.

The offending line of code is this one:

Code:

<input type="image" src="close.gif" class="jqmdX jqmClose" />

If I remove this line, I lose my close button but the submit query issue goes away. It seems to me that the issue is most likely a CSS one (that's just my guess). Since the CSS files I added are the same between the test and production versions, the only difference has to be CI.

Here's the additional CSS code:
survey_filter.css (basically taken from the jqModal example)

Code:

div.whiteOverlay { background: url(inc/jqmBG.gif) white; }
div.jqDrag {cursor: move;}

/* jqmModal dialog CSS courtesy of;
Brice Burgess <[email protected]> */

div.jqmDialog {
display: none;
    
    position: fixed;
    top: 17%;
    left: 50%;
    
    margin-left: -200px;
width: 420px;

overflow: hidden;
font-family:verdana,tahoma,helvetica;
}

/* Fixed posistioning emulation for IE6
     Star selector used to hide definition from browsers other than IE6
     For valid CSS, use a conditional include instead */
* html div.jqmDialog {
     position: absolute;
     top: [removed](document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px');
}


/*color: #d5ff84, #528c00;*/

/* [[[ Title / Top Classes ]]] */
div.jqmdTC {
background: #FFFFFF url(/images/sprite.gif) repeat-x 0px -82px;
color: #000000;
padding: 7px 22px 5px 5px;
font-family:"sans serif",verdana,tahoma,helvetica;
font-weight: bold;
* zoom: 1;
}
div.jqmdTL { background:  url(/images/sprite.gif) no-repeat 0px -41px; padding-left: 3px;}
div.jqmdTR { background: url(/images/sprite.gif) no-repeat right 0px; padding-right: 3px; * zoom: 1;}


/* [[[ Body / Message Classes ]]] */
div.jqmdBC {
background: url(/images/bc.gif) repeat-x center bottom;
padding: 7px 7px 7px;
height: 180px;
overflow: auto;
}
div.jqmdBL { background: url(/images/bl.gif) no-repeat left bottom; padding-left: 7px; }
div.jqmdBR { background: url(/images/br.gif) no-repeat right bottom; padding-right: 7px; * zoom: 1 }

div.jqmdMSG { color: #000000; }


/* [[[ Button classes ]]] */
input.jqmdX {
position: absolute;
right: 7px;
top: 4px;
padding: 0 0 0 19px;
height: 19px;
width: 0px;
background: url(/images/close.gif) no-repeat top right;
overflow: hidden;
}
input.jqmdXFocus {background-position: bottom right; outline: single;}

div.jqmdBC button, div.jqmdBC input[type="submit"] {
margin: 8px 10px 4px 10px;
color: #777;
background-color: #fff;
cursor: pointer;
}

/* div.jqmDialog input:focus, div.jqmDialog input.iefocus { background-color: #eaffc3; } */
div.jqmDialog input:focus, div.jqmDialog input.iefocus { background-color: #eaffc3; }

That's it. The jqModal .css is straight from the website.

I note also that the buttons and entry objects have changed size... I wonder if that could be causing the problem but I don't know.

Thanks for hanging with me on this.

[eluser]bazianm[/eluser]
For anyone reading this thread, I figured it out. Turns out that it was a CSS problem and not a CI problem. There was a setting for the &lt;input = "image" object that was causing this. I couldn't tell you what about that setting was causing the problem but i do know that removing that line from the style sheet fixed it.

Thank you to everyone who responded and tried to help!