Home/ Questions/Q 8368763
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-09T13:27:51+00:00

Okay.. this is the file lo_add.php: <div class=rowElem> <label>Item <? echo $i ?>:</label> <div

  • 0

Okay.. this is the file lo_add.php:

<div class="rowElem">
    <label>Item <? echo $i ?>:</label>
    <div class="formRight searchDrop">
        <select name="lo_item[]" class="chzn-select" data-placeholder="Choose an Item">
            <option value=""></option>
            <? $item_query = mysql_query("select id,code,title,price from items where domain_id='$domain_id' order by code");
            while ($items = mysql_fetch_array($item_query)) { ?>
                <option value="<? echo $items["id"] ?>"><? echo $items["code"]." - ".$items["title"]." - RM".$items["price"] ?></option>
            <? } ?>
        </select>
    </div>
    <label>Delivery Address :</label>
    <div class="formRight searchDrop">
        <select name="lo_site[]" class="chzn-select" data-placeholder="Choose a Delivery Address">
            <option value=""></option>
                <? $site_query = mysql_query("select id,name from sites where domain_id='$domain_id' order by name");
                while ($sites = mysql_fetch_array($site_query)) { ?>
                    <option value="<? echo $sites["id"] ?>"><? echo $sites["name"] ?></option>
                <? } ?>
        </select>
    </div>
    <div class="fix"></div>
    <label>Quantity:<span class="req">*</span></label>
    <div class="formRight onlyNums">
        <input type="text" name="lo_quantity[]" id="lo_quantity[]"/>
    </div>
    <div class="fix"></div>
</div>

And this is the html file that calls the css and what have you in the beginning:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<title>Mecacom Technologies&reg; Maintenance System &copy; 2012</title>

<link href="/css/main.css" rel="stylesheet" type="text/css" />
<link href='http://fonts.googleapis.com/css?family=Cuprum' rel='stylesheet' type='text/css' />

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="js/plugins/wizards/jquery.validate.js"></script>
<script type="text/javascript">
$(document).ready(function() {
  $('#addElement').click(function() {
    var data = '';
    $.get('/ajax/lo_add.php', data, function(response){
      $('#hello').append(response);
    });
  });
});
</script>

</head>
<body>
    <div class="content" id="container">
        <div class="title"><h5>Record New Local Order</h5></div>

        <form action="<? echo $PHP_SELF ?>?add=1" id="valid" class="mainForm" method="post" enctype="multipart/form-data">
            <fieldset>
                <div class="widget">
                    <div class="head"><h5 class="iLocked2">New Local Order Credentials</h5></div>

                    <div class="rowElem noborder">
                        <label>Order ID:<span class="req">*</span></label>
                        <div class="formRight">
                            <input type="text" class="validate[required]" name="order_id" id="order_id"/>
                        </div>
                        <div class="fix"></div>
                   </div>

                    <div class="rowElem noborder">
                        <label>Order Date:<span class="req">*</span></label>
                        <div class="formRight">
                            <input type="text" name="order_date" class="datepicker validate[required]" />
                        </div>
                        <div class="fix"></div>
                    </div>
                    <div id="hello"></div>

                    <div class="fix"></div>
                    <a href="#" id="addElement">Click To Append More Item</a>
                    <input type="submit" value="Next" class="greyishBtn submitForm" />
                    <div class="fix"><input type="hidden" name="addnow" value="1" /></div>
                </div>
            </fieldset>

        </form>
    </div>
</body>
</html>

sigh .. quite a handful … How do you think that the css aren’t being rendered correctly after the jquery append?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I can see from your live test page that you are using Chosen to process the dropdowns and jQuery validation plugin to validate the quantity field.

    The first thing is to make sure you call chosen() on the newly created dropdowns. This has to be called for new elements, because Chosen doesn’t only rely on CSS, but changes the entire HTML structure of the dropdowns. So add this line, following your append,

    $(".chzn-select").chosen()

    Second is to make sure you validate the newly created quantity textfields by calling validate() on them, or re-calling whatever javascript you called to initialize the validate plugin.

    • 0