Member Avatar for UK-1991

Hello,

I have just created a new page of form submittion but wanted to show different form value when different option is selected from the dropdown can any please help me out with this concirn.

Here is my code

<form method="post" name="form2" action="insert_report.php">
<label>  
    <p><b>Campaign</b></p>
    <p>
        <select name="campaign">
            <option value="">Select Campaign</option>
            <option value="web">Karachi</option>
            <option value="logo">Lahore</option>
            <option value="graphic">Islamabad</option>
        </select>                            
    <p>
</label>

<label>  
    <?php
        switch ($_POST['campaign'])
        {
            case 'web':
                echo "<p><b>Web Status</b></p>";
                echo "<p><input type='text' name='stat' class='pw'></p>";
                echo "<p><b>Pages Develop</b></p>";
                echo "<p><input type='text' name='dev' class='pw'></p>";
                break;
            case 'logo':
                echo "<p><b>Logo Uploaded</b></p>";
                echo "<p><input type='text' name='logo1' class='pw'></p>";
                echo "<p><b>Revised Logo</b></p>";
                echo "<p><input type='text' name='logo2' class='pw'></p>";
                break;
            case 'graphic':
                echo "<p><b>Type Of Designs</b></p>";
                echo "<p><input type='text' name='tod' class='pw'></p>";
                echo "<p><b>Worked On Revisions</b></p>";
                echo "<p><input type='text' name='wor' class='pw'></p>";
                break;
            default:
                echo " ";
    }
    ?>
</label>

I hope you guyz will help me out with this concirn

Thank you

  • 2 Contributors
  • 3 Replies
  • 260 Views
  • 11 Hours Discussion Span
  • Latest Post Latest Post by kazkuzzer007

Dani AI

Generated

Short version: the reason your first attempt didn’t show fields immediately is that PHP runs on the server — checking $_POST['campaign'] only helps after a form submit. ’s approach (listen for the select change and request the right fragment) is a good fix. Below are practical alternatives, gotchas, and a small client-side pattern you can use if you prefer no server round-trip.

Two common patterns

  • Client-side toggling of pre-rendered sections: render each group of inputs in the page and show/hide them with JS. Fast and works offline; good when the different blocks are small.
  • Dynamic loading (AJAX/fetch): request only the fragment you need from the server when the selection changes. Keeps initial page small and centralizes server-side logic, but remember to sanitize server output and prefer sending JSON + template rather than raw HTML to reduce XSS risk.

Checklist & troubleshooting

  • Make sure the <select> has both name (for submission) and id (for JS).
  • Inputs added dynamically must have name attributes to be included in the final POST. Note: disabled fields are NOT submitted; inputs hidden with CSS still submit. Remove name or use disabled intentionally depending on whether you want values sent.
  • Always validate and sanitize on the server — client code is only UX. Use POST for form submission and include CSRF protection if appropriate.
  • If you use GET for AJAX, watch browser caching (append a timestamp or use cache control). Check the browser console for JS errors when things don’t happen.

Small, unobtrusive client-side pattern (vanilla JS)

<select id="campaign" name="campaign"> ... </select>

<fieldset data-campaign="campaign_web" style="display:none"> ...inputs... </fieldset>
<fieldset data-campaign="campaign_logo" style="display:none"> ...inputs... </fieldset>

<script>
document.addEventListener('DOMContentLoaded',function(){
  var sel = document.getElementById('campaign');
  var zones = document.querySelectorAll('[data-campaign]');
  function show(v){
    zones.forEach(function(z){ z.style.display = z.getAttribute('data-campaign')===v ? '' : 'none'; });
  }
  sel.addEventListener('change', function(){ show(this.value); });
  show(sel.value);
});
</script>

Notes: this pattern keeps the server simple and avoids extra requests; use the AJAX approach (as suggested) when fragments are large or need server data. For final submission, re-populate the selected value on the server-rendered response so the user sees what they submitted.

Recommended Answers

All 3 Replies

Member Avatar for kazkuzzer007

you should make use jquery. this is for example:
file a.php

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript" src="assets/js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript">
    var htmlobjek;
    $(document).ready(function(){
      $("#campaign").change(function(){
        var campaign = $("#campaign").val();
        $.ajax({
            url: "aget.php",
            data: "campaign="+campaign,
            cache: false,
            success: function(msg){
                $("#content").html(msg);
            }
        });
      });
    });

</script>
</head>
<body>
    <form method="post" name="form2" action="insert_report.php">
    <label>  
        <p><b>Campaign</b></p>
        <p>
        <select name="campaign" id="campaign">
            <option value="">Select Campaign</option>
            <option value="web">Karachi</option>
            <option value="logo">Lahore</option>
            <option value="graphic">Islamabad</option>
        </select>                            
    <p>
    </label>
    <label id="content">  

    </label>
    </form>
</body>
</html>

file aget.php

<?php
        switch ($_GET['campaign'])
        {
            case 'web':
                echo "<p><b>Web Status</b></p>";
                echo "<p><input type='text' name='stat' class='pw'></p>";
                echo "<p><b>Pages Develop</b></p>";
                echo "<p><input type='text' name='dev' class='pw'></p>";
                break;
            case 'logo':
                echo "<p><b>Logo Uploaded</b></p>";
                echo "<p><input type='text' name='logo1' class='pw'></p>";
                echo "<p><b>Revised Logo</b></p>";
                echo "<p><input type='text' name='logo2' class='pw'></p>";
                break;
            case 'graphic':
                echo "<p><b>Type Of Designs</b></p>";
                echo "<p><input type='text' name='tod' class='pw'></p>";
                echo "<p><b>Worked On Revisions</b></p>";
                echo "<p><input type='text' name='wor' class='pw'></p>";
                break;
            default:
                echo " ";
    }
    ?>
Member Avatar for UK-1991

Greate it worked Thank You

Member Avatar for kazkuzzer007

You're welcome :)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.