пытаясь получить данные нескольких таблиц в одной строке - PullRequest
Новая
       12

пытаясь получить данные нескольких таблиц в одной строке

0 голосов
/ 17 ноября 2011

Я чувствую себя действительно глупо из-за того, что не могу понять это, так что вот я, снова в stackoverflow!У меня есть действительно базовая таблица, которая будет использоваться в качестве формы бронирования.Есть даты заезда и отъезда, которые пользователь должен заполнить, используя выпадающие меню для дня, месяца и года.По какой-то причине между днем ​​и месяцем существует большой разрыв, сдвигая месяц и год вправо от окна браузера.

почему?я знаю, что это должно быть что-то простое, поэтому я пинаю себя за неспособность понять это.вздох.Можете ли вы помочь мне?

вот соответствующий код (я обновил его, чтобы включить от начала до конца, но удалил много JavaScript с конца).Связанные css-файлы доступны, если вы поместите их в URL, но они мне мало что сказали ..: 

    <link rel="stylesheet" type="text/css"      href="http://www.emailmeform.com/builder/styles/dynamic.php?t=post" />
    <link rel="stylesheet" type="text/css"     href="http://www.emailmeform.com/builder/theme_css/f4kIcSddmwd92Jc1Zfx05Me8" />
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
    <script type="text/javascript">
    if (typeof jQuery == 'undefined'){
    document.write(unescape("%3Cscript src='http://www.emailmeform.com/builder/js/jquery-1.4.4.min.js' type='text/javascript'%3E%3C/script%3E"));
     }
    </script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
    <script type="text/javascript">
       if (typeof $.ui == 'undefined'){
document.write(unescape("%3Cscript src='http://www.emailmeform.com/builder/js/jquery-ui-1.7.2.custom.min.js' type='text/javascript'%3E%3C/script%3E"));
        }
       </script>
       <script type="text/javascript" src="http://www.emailmeform.com/builder/js/dynamic.php?t=post&t2=0&use_CDN=true"></script>   
      <div id="emf-container-outer">
      <div id="emf-container">
      <div id="emf-logo">
  <a>EmailMeForm</a>
</div>
<form id="emf-form" class="leftLabel" enctype="multipart/form-data" method="post" action="http://www.emailmeform.com/builder/form/f4kIcSddmwd92Jc1Zfx05Me8" name="emf-form">
  <div id="emf-form-instruction" class="emf-head-widget">
    <div id="emf-form-description">
      Please fill out the form below if you know which dates you would like to stay at Sarita.
    </div>
  </div>
  <ul>
    <li id="emf-li-0" class="emf-li-field emf-field-name data_container" style="text-align:left">
      <label class="emf-label-desc" for="element_0">Name <span>*</span></label>
      <div class="emf-div-field">
        <span><input class="validate[required] emf-input-w60" value="" id="element_0_2" name="element_0[]" type="text" /> <label for="element_0_2" class=
        "emf-bottom-label emf-text-center">First</label></span> <span><input class="validate[required] emf-input-w100" value="" id="element_0_3" name="element_0[]" type="text" /> <label for=
        "element_0_3" class="emf-bottom-label emf-text-center">Last</label></span>
      </div>
      <div class="emf-clear"></div>
    </li>
    <li id="emf-li-1" class="emf-li-field emf-field-email data_container" style="text-align:left">
      <label class="emf-label-desc" for="element_1">Email <span>*</span></label>
      <div class="emf-div-field">
        <input id="element_1" name="element_1" class="validate[required,custom[email]]" value="" size="30" type="text" />
      </div>
      <div class="emf-clear"></div>
    </li>
    <li id="emf-li-2" class="emf-li-field emf-field-select data_container" style="text-align:left">
      <label class="emf-label-desc" for="element_2">Check-IN Date <span>*</span></label>
      <div class="emf-div-field">
        <select id="element_2" name="element_2" class="validate[required]">
          <option value="" selected="selected">
            Day
          </option>
          <option value="1">
            1
          </option>
          <option value="2">
            2
          </option>
          <option value="3">
            3
          </option>
          <option value="4">
            4
          </option>
          <option value="5">
            5
          </option>
          <option value="6">
            6
          </option>
          <option value="7">
            7
          </option>
          <option value="8">
            8
          </option>
          <option value="9">
            9
          </option>
          <option value="10">
            10
          </option>
          <option value="11">
            11
          </option>
          <option value="12">
            12
          </option>
          <option value="13">
            13
          </option>
          <option value="14">
            14
          </option>
          <option value="15">
            15
          </option>
          <option value="16">
            16
          </option>
          <option value="17">
            17
          </option>
          <option value="18">
            18
          </option>
          <option value="19">
            19
          </option>
          <option value="20">
            20
          </option>
          <option value="21">
            21
          </option>
          <option value="22">
            22
          </option>
          <option value="23">
            23
          </option>
          <option value="24">
            24
          </option>
          <option value="25">
            25
          </option>
          <option value="26">
            26
          </option>
          <option value="27">
            27
          </option>
          <option value="28">
            28
          </option>
          <option value="29">
            29
          </option>
          <option value="30">
            30
          </option>
          <option value="31">
            31
          </option>
        </select>
      </div>
      <div class="emf-clear"></div>
    </li>
    <li id="emf-li-3" class="emf-li-field emf-field-select data_container" style="text-align:left">
      <div class="emf-div-field">
        <select id="element_3" name="element_3" class="validate[optional]">
          <option value="Month" selected="selected">
            Month
          </option>
          <option value="January">
            January
          </option>
          <option value="February">
            February
          </option>
          <option value="March">
            March
          </option>
          <option value="April">
            April
          </option>
          <option value="May">
            May
          </option>
          <option value="June">
            June
          </option>
          <option value="July">
            July
          </option>
          <option value="August">
            August
          </option>
          <option value="September">
            September
          </option>
          <option value="October">
            October
          </option>
          <option value="November">
            November
          </option>
          <option value="December">
            December
          </option>
        </select>
      </div>
      <div class="emf-clear"></div>
    </li>
    <li id="emf-li-4" class="emf-li-field emf-field-select data_container" style="text-align:left">
      <div class="emf-div-field">
        <select id="element_4" name="element_4" class="validate[optional]">
          <option value="Year" selected="selected">
            Year
          </option>
          <option value="2011">
            2011
          </option>
          <option value="2012">
            2012
          </option>
          <option value="2013">
            2013
          </option>
          <option value="2014">
            2014
          </option>
          <option value="2015">
            2015
          </option>
          <option value="2016">
            2016
          </option>
          <option value="2017">
            2017
          </option>
          <option value="2018">
            2018
          </option>
          <option value="2019">
            2019
          </option>
          <option value="2020">
            2020
          </option>
        </select>
      </div>
      <div class="emf-clear"></div>
    </li>
    <li id="emf-li-5" class="emf-li-field emf-field-select data_container" style="text-align:left">
      <label class="emf-label-desc" for="element_5">Check-OUT Date <span>*</span></label>
      <div class="emf-div-field">
        <select id="element_5" name="element_5" class="validate[required]">
          <option value="" selected="selected">
            Day
          </option>
          <option value="1">
            1
          </option>
          <option value="2">
            2
          </option>
          <option value="3">
            3
          </option>
          <option value="4">
            4
          </option>
          <option value="5">
            5
          </option>
          <option value="6">
            6
          </option>
          <option value="7">
            7
          </option>
          <option value="8">
            8
          </option>
          <option value="9">
            9
          </option>
          <option value="10">
            10
          </option>
          <option value="11">
            11
          </option>
          <option value="12">
            12
          </option>
          <option value="13">
            13
          </option>
          <option value="14">
            14
          </option>
          <option value="15">
            15
          </option>
          <option value="16">
            16
          </option>
          <option value="17">
            17
          </option>
          <option value="18">
            18
          </option>
          <option value="19">
            19
          </option>
          <option value="20">
            20
          </option>
          <option value="21">
            21
          </option>
          <option value="22">
            22
          </option>
          <option value="23">
            23
          </option>
          <option value="24">
            24
          </option>
          <option value="25">
            25
          </option>
          <option value="26">
            26
          </option>
          <option value="27">
            27
          </option>
          <option value="28">
            28
          </option>
          <option value="29">
            29
          </option>
          <option value="30">
            30
          </option>
          <option value="31">
            31
          </option>
        </select>
      </div>
      <div class="emf-clear"></div>
    </li>
    <li id="emf-li-6" class="emf-li-field emf-field-select data_container" style="text-align:left">
      <div class="emf-div-field">
        <select id="element_6" name="element_6" class="validate[optional]">
          <option value="Month" selected="selected">
            Month
          </option>
          <option value="January">
            January
          </option>
          <option value="February">
            February
          </option>
          <option value="March">
            March
          </option>
          <option value="April">
            April
          </option>
          <option value="May">
            May
          </option>
          <option value="June">
            June
          </option>
          <option value="July">
            July
          </option>
          <option value="August">
            August
          </option>
          <option value="September">
            September
          </option>
          <option value="October">
            October
          </option>
          <option value="November">
            November
          </option>
          <option value="December">
            December
          </option>
        </select>
      </div>
      <div class="emf-clear"></div>
    </li>
    <li id="emf-li-7" class="emf-li-field emf-field-select data_container" style="text-align:left">
      <div class="emf-div-field">
        <select id="element_7" name="element_7" class="validate[optional]">
          <option value="Year" selected="selected">
            Year
          </option>
          <option value="2011">
            2011
          </option>
          <option value="2012">
            2012
          </option>
          <option value="2013">
            2013
          </option>
          <option value="2014">
            2014
          </option>
          <option value="2015">
            2015
          </option>
          <option value="2016">
            2016
          </option>
          <option value="2017">
            2017
          </option>
          <option value="2018">
            2018
          </option>
          <option value="2019">
            2019
          </option>
          <option value="2020">
            2020
          </option>
        </select>
      </div>
      <div class="emf-clear"></div>
    </li>
    <li id="emf-li-8" class="emf-li-field emf-field-textarea data_container" style="text-align:left">
      <label class="emf-label-desc" for="element_8">Special requests</label>
      <div class="emf-div-field">
        <textarea id="element_8" name="element_8" cols="45" rows="10" class="validate[optional]">
        </textarea>
      </div>
      <div class="emf-clear"></div>
    </li>
    <li id="emf-li-recaptcha">
      <script type="text/javascript">
       //<![CDATA[

                            $(function(){
                                    $('#recaptcha_response_field').addClass('validate[required]');
                            });
      //]]>
      </script>
      <div>
        <script type="text/javascript">
        //<![CDATA[
        var RecaptchaOptions = {
            theme: 'clean',
            custom_theme_widget: 'emf-recaptcha_widget'
            };
        //]]>
          </script> <script type="text/javascript" src="https://www.google.com/recaptcha/api/challenge?k=6LchicQSAAAAAGksQmNaDZMw3aQITPqZEsX77lT9">

Ответы [ 3 ]

0 голосов
/ 17 ноября 2011

Я отредактировал полный исходный код.

Используйте любые программы сравнения diff, чтобы понять два файла.

В основном, ваш месяц и год были в разных тегах li, поэтому они были на следующей строке 

    <link rel="stylesheet" type="text/css"      href="http://www.emailmeform.com/builder/styles/dynamic.php?t=post" />
    <link rel="stylesheet" type="text/css"     href="http://www.emailmeform.com/builder/theme_css/f4kIcSddmwd92Jc1Zfx05Me8" />
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
    <script type="text/javascript">
    if (typeof jQuery == 'undefined'){
    document.write(unescape("%3Cscript src='http://www.emailmeform.com/builder/js/jquery-1.4.4.min.js' type='text/javascript'%3E%3C/script%3E"));
     }
    </script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
    <script type="text/javascript">
       if (typeof $.ui == 'undefined'){
document.write(unescape("%3Cscript src='http://www.emailmeform.com/builder/js/jquery-ui-1.7.2.custom.min.js' type='text/javascript'%3E%3C/script%3E"));
        }
       </script>
       <script type="text/javascript" src="http://www.emailmeform.com/builder/js/dynamic.php?t=post&t2=0&use_CDN=true"></script>   
      <div id="emf-container-outer">
      <div id="emf-container">
      <div id="emf-logo">
  <a>EmailMeForm</a>
</div>
<form id="emf-form" class="leftLabel" enctype="multipart/form-data" method="post" action="http://www.emailmeform.com/builder/form/f4kIcSddmwd92Jc1Zfx05Me8" name="emf-form">
  <div id="emf-form-instruction" class="emf-head-widget">
    <div id="emf-form-description">
      Please fill out the form below if you know which dates you would like to stay at Sarita.
    </div>
  </div>
  <ul>
    <li id="emf-li-0" class="emf-li-field emf-field-name data_container" style="text-align:left">
      <label class="emf-label-desc" for="element_0">Name <span>*</span></label>
      <div class="emf-div-field">
        <span><input class="validate[required] emf-input-w60" value="" id="element_0_2" name="element_0[]" type="text" /> <label for="element_0_2" class=
        "emf-bottom-label emf-text-center">First</label></span> <span><input class="validate[required] emf-input-w100" value="" id="element_0_3" name="element_0[]" type="text" /> <label for=
        "element_0_3" class="emf-bottom-label emf-text-center">Last</label></span>
      </div>
      <div class="emf-clear"></div>
    </li>
    <li id="emf-li-1" class="emf-li-field emf-field-email data_container" style="text-align:left">
      <label class="emf-label-desc" for="element_1">Email <span>*</span></label>
      <div class="emf-div-field">
        <input id="element_1" name="element_1" class="validate[required,custom[email]]" value="" size="30" type="text" />
      </div>
      <div class="emf-clear"></div>
    </li>
    <li id="emf-li-2" class="emf-li-field emf-field-select data_container" style="text-align:left">
      <label class="emf-label-desc" for="element_2">Check-IN Date <span>*</span></label>
      <div class="emf-div-field">
        <select id="element_2" name="element_2" class="validate[required]">
          <option value="" selected="selected">
            Day
          </option>
          <option value="1">
            1
          </option>
          <option value="2">
            2
          </option>
          <option value="3">
            3
          </option>
          <option value="4">
            4
          </option>
          <option value="5">
            5
          </option>
          <option value="6">
            6
          </option>
          <option value="7">
            7
          </option>
          <option value="8">
            8
          </option>
          <option value="9">
            9
          </option>
          <option value="10">
            10
          </option>
          <option value="11">
            11
          </option>
          <option value="12">
            12
          </option>
          <option value="13">
            13
          </option>
          <option value="14">
            14
          </option>
          <option value="15">
            15
          </option>
          <option value="16">
            16
          </option>
          <option value="17">
            17
          </option>
          <option value="18">
            18
          </option>
          <option value="19">
            19
          </option>
          <option value="20">
            20
          </option>
          <option value="21">
            21
          </option>
          <option value="22">
            22
          </option>
          <option value="23">
            23
          </option>
          <option value="24">
            24
          </option>
          <option value="25">
            25
          </option>
          <option value="26">
            26
          </option>
          <option value="27">
            27
          </option>
          <option value="28">
            28
          </option>
          <option value="29">
            29
          </option>
          <option value="30">
            30
          </option>
          <option value="31">
            31
          </option>
        </select>
        <select id="element_3" name="element_3" class="validate[optional]">
          <option value="Month" selected="selected">
            Month
          </option>
          <option value="January">
            January
          </option>
          <option value="February">
            February
          </option>
          <option value="March">
            March
          </option>
          <option value="April">
            April
          </option>
          <option value="May">
            May
          </option>
          <option value="June">
            June
          </option>
          <option value="July">
            July
          </option>
          <option value="August">
            August
          </option>
          <option value="September">
            September
          </option>
          <option value="October">
            October
          </option>
          <option value="November">
            November
          </option>
          <option value="December">
            December
          </option>
        </select>
        <select id="element_4" name="element_4" class="validate[optional]">
          <option value="Year" selected="selected">
            Year
          </option>
          <option value="2011">
            2011
          </option>
          <option value="2012">
            2012
          </option>
          <option value="2013">
            2013
          </option>
          <option value="2014">
            2014
          </option>
          <option value="2015">
            2015
          </option>
          <option value="2016">
            2016
          </option>
          <option value="2017">
            2017
          </option>
          <option value="2018">
            2018
          </option>
          <option value="2019">
            2019
          </option>
          <option value="2020">
            2020
          </option>
        </select>
      </div>
      <div class="emf-clear"></div>
    </li>
    <li id="emf-li-5" class="emf-li-field emf-field-select data_container" style="text-align:left">
      <label class="emf-label-desc" for="element_5">Check-OUT Date <span>*</span></label>
      <div class="emf-div-field">
        <select id="element_5" name="element_5" class="validate[required]">
          <option value="" selected="selected">
            Day
          </option>
          <option value="1">
            1
          </option>
          <option value="2">
            2
          </option>
          <option value="3">
            3
          </option>
          <option value="4">
            4
          </option>
          <option value="5">
            5
          </option>
          <option value="6">
            6
          </option>
          <option value="7">
            7
          </option>
          <option value="8">
            8
          </option>
          <option value="9">
            9
          </option>
          <option value="10">
            10
          </option>
          <option value="11">
            11
          </option>
          <option value="12">
            12
          </option>
          <option value="13">
            13
          </option>
          <option value="14">
            14
          </option>
          <option value="15">
            15
          </option>
          <option value="16">
            16
          </option>
          <option value="17">
            17
          </option>
          <option value="18">
            18
          </option>
          <option value="19">
            19
          </option>
          <option value="20">
            20
          </option>
          <option value="21">
            21
          </option>
          <option value="22">
            22
          </option>
          <option value="23">
            23
          </option>
          <option value="24">
            24
          </option>
          <option value="25">
            25
          </option>
          <option value="26">
            26
          </option>
          <option value="27">
            27
          </option>
          <option value="28">
            28
          </option>
          <option value="29">
            29
          </option>
          <option value="30">
            30
          </option>
          <option value="31">
            31
          </option>
        </select>
        <select id="element_6" name="element_6" class="validate[optional]">
          <option value="Month" selected="selected">
            Month
          </option>
          <option value="January">
            January
          </option>
          <option value="February">
            February
          </option>
          <option value="March">
            March
          </option>
          <option value="April">
            April
          </option>
          <option value="May">
            May
          </option>
          <option value="June">
            June
          </option>
          <option value="July">
            July
          </option>
          <option value="August">
            August
          </option>
          <option value="September">
            September
          </option>
          <option value="October">
            October
          </option>
          <option value="November">
            November
          </option>
          <option value="December">
            December
          </option>
        </select>
        <select id="element_7" name="element_7" class="validate[optional]">
          <option value="Year" selected="selected">
            Year
          </option>
          <option value="2011">
            2011
          </option>
          <option value="2012">
            2012
          </option>
          <option value="2013">
            2013
          </option>
          <option value="2014">
            2014
          </option>
          <option value="2015">
            2015
          </option>
          <option value="2016">
            2016
          </option>
          <option value="2017">
            2017
          </option>
          <option value="2018">
            2018
          </option>
          <option value="2019">
            2019
          </option>
          <option value="2020">
            2020
          </option>
        </select>
        </div>
      <div class="emf-clear"></div>
    </li>
    <li id="emf-li-8" class="emf-li-field emf-field-textarea data_container" style="text-align:left">
      <label class="emf-label-desc" for="element_8">Special requests</label>
      <div class="emf-div-field">
        <textarea id="element_8" name="element_8" cols="45" rows="10" class="validate[optional]">
        </textarea>
      </div>
      <div class="emf-clear"></div>
    </li>
    <li id="emf-li-recaptcha">
      <script type="text/javascript">
       //<![CDATA[

                            $(function(){
                                    $('#recaptcha_response_field').addClass('validate[required]');
                            });
      //]]>
      </script>
      <div>
        <script type="text/javascript">
        //<![CDATA[
        var RecaptchaOptions = {
            theme: 'clean',
            custom_theme_widget: 'emf-recaptcha_widget'
            };
        //]]>
          </script> <script type="text/javascript" src="https://www.google.com/recaptcha/api/challenge?k=6LchicQSAAAAAGksQmNaDZMw3aQITPqZEsX77lT9">
0 голосов
/ 18 ноября 2011

Простое исправление здесь!

Вам нужно будет удалить 12 строк вашего кода из html и удалить width:64%;, который определен в вашем CSS в строке 618 из dynamic.php : 

#emf-container #emf-form.leftLabel div.emf-div-field,
#emf-container #emf-form.rightLabel div.emf-div-field{float:left;width:64%;}

Строки для удаления находятся между 3 полями выбора:

Непосредственно перед полем выбора месяца снимите: 

  <div class="emf-clear"></div>
</li>
<li id="emf-li-3" class="emf-li-field emf-field-select data_container" style="text-align:left">

Непосредственно перед полем выбора года снимите: 

  <div class="emf-clear"></div>
</li>
<li id="emf-li-4" class="emf-li-field emf-field-select data_container" style="text-align:left">

Сделайте тот же самый процесс удаления для раздела извлечения, и вы золотой!

Удачи! К вашему сведению, когда вы заключаете содержимое в теги <li>, оно структурирует его в виде вертикального списка. Вы можете получить список по горизонтали, используя li{float:left;}, но это не будет работать с тем, как структурирован ваш контент. Было бы намного проще просто удалить строки, которые я упомянул выше, чем переписать ваш код.

Ура!

0 голосов
/ 17 ноября 2011

Похоже на скрипке и моем браузере, наверное, это о css

Можете ли вы добавить CSS-файлы или стили и сценарии?

http://jsfiddle.net/BzQBV/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...