Making a custom Wordpress page and using the  while loop:

while ( have_posts() ) : the_post(); 

Select all Open in new window

i want to make the output 2 colums

i use bootstrap grid in our code so i should be able to do

<div = row>
  <div = col-md-6>left
  <div = col-md-6>right
</div>

Select all Open in new window

and the

%2 mod operator

Select all Open in new window

but that doesn't seam to work

here is my current code

<div class="clearfix">&nbsp;</div>			 

<?php 
$counter = 1;
if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
	<?php 
	$class = ($x%2 == 0)? 'RowWhiteBackground': 'RowGraybackground';
	?>
<?php 
       if ($counter == 1)
        {
               echo '<div  id="'.$counter.'" class="'.$class.'">';
		               echo  '<div class="col-md-4">';
					   ?>
					   	<div class="panel panel-primary">
							<div class="panel-heading"><h5><a href="<?php the_permalink(); ?>" style="color: #fff;" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h5></div>
							<div class="panel-body">
							<img height="150" width="150" style="padding : 0px 10px 0px 10px;"  vspace="10" class="alignleft" alt="<?php the_title_attribute(); ?>" src="<?php echo catch_that_image()?>" />
							<?php echo get_the_excerpt(); ?> 
							</div>
						</div>
						<?php 
					    $counter++;
					   echo  '</div>';
        } else if ($counter == 2) {
		                echo  '<div class="col-md-4">';
					   ?>
					   	<div class="panel panel-primary">
				

Select all Open in new window

…

I have this code:

<div class="row" style="padding-top:10px;">
			<div class="col-sm-12 col-xs-12 text-left"><input type="checkbox" name="selall" >&nbsp;<span id="selall" onClick="sel_all();">Select All</span></div>
		</div>
		<div class="row" style="padding-top:10px;">
				
			<div class="row" style="padding-top:10px;">
				<div class="col-sm-6 col-xs-6"><input type="checkbox" id="summtr" name="summtr" >&nbsp;<span id="strtxt" onClick="setsummtrcheck();">Summary (Trade Pricing)</span></div>
				<div class="col-sm-6 col-xs-6"><input type="checkbox" id="spec" name="spec" >&nbsp;<span id="spectxt" onClick="setspeccheck();">Sample Spec</span></div>
			</div>	
			<div class="row" style="padding-top:10px;">
				<div class="col-sm-6 col-xs-6"><input type="checkbox" id="summnt" name="summnt" >&nbsp;<span id="snttxt" onClick="setsummntcheck();">Summary (Net Pricing)</span></div>
				<div class="col-sm-6 col-xs-6"><input type="checkbox" id="broc" name="broc" >&nbsp;<span id="broctxt" onClick="setbroccheck();">Product Brochure</span></div>
			</div>	
			<div class="row" style="padding-top:10px;">
				<div class="col-sm-6 col-xs-6"><input type="checkbox" id="summnp" name="summnp" >&nbsp;<span id="snptxt" onClick="setsummnpcheck();">Summary (No Pricing)</span></div>
				<div class="col-sm-6 col-xs-6"><input type="checkbox" id="draw" name="draw" >&nbsp;<span id="drawtxt" onClick="setdrawcheck();">PDF Drawing File</span></div>
			</div>	

Select all Open in new window

It produces the output as in the attached image. Why does the "Select All" not align vertically with the checkbox elements underneath? I tried everything I could think of, like text-left, which is superfluous .

Thanks
Misalign.PNG

https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_form_steps
I am using above form wizard and everything is working fine except the validation. the current code will only validate if the <input> field is empty.
My question is: how to use jquery built-in validation in this case so I do not have to write codes to check one by one? Because in my case, I have over 20+ <input> for each steps and I have at least 5 steps to go.

thanks

using getbootstrap.com for my website and have some questions how to  <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
inside of the <input type=text> as below.

 <div class="form-group row">
            <label for="@i.QuestionControlID" class="col-sm-@i.QuestionHtmlLabelSize col-form-label col-form-label-sm">@i.QuestionHtmlLabel</label>
            <div class="col-sm-@i.QuestionControlIDSize">
               <input value="" data-toggle="tooltip" data-placement="bottom" title="@i.QuestionToolTip" class="form-control" type="@i.QuestionHtmlType" placeholder="@i.QuestionHtmlPlaceHolder" id="@i.QuestionControlID" @i.QuestionHtmlIsRequired />
            </div>
        </div>

Select all Open in new window

Adtran NetVanta 1335 using a DB9 serial cable following the below procedures the router prompts for username and password.

Problem:  Acquired a used Adtran 3450 router and needed to configure it for a location that needed a router.   Problem was that I didn’t know the password for the web user, enable and the console user.   I needed to find a way to reset this router or change the password.

Solution:  To get into the router and bypass the passwords, you need to console into the router using a DB9 serial cable and a VT100 emulator like Putty or HyperTerminal.  When connected, pres ESC within the first 5 seconds of the unit powering on to get into bootstrap mode.  Once in bootstrap mode, type bypass passwords and press enter.  Then type boot and the unit will reboot, bypassing the need for passwords.

Reset Password:

At the # prompt type config terminal and press Enter.
At the (config)# prompt, type enable password password Where password is your new password.
At the (config)# prompt, type username youruser password yourpassword and click enter.  Of course yourmuser and Your password are the user and password that you choose.  This will create a new administrator user where you can login without going into bootstrap mode.
Type exit and the write mem to save the config.

Tried putty and hyperterminal get the same results.

I'm developing a Bootstrap project and started out with a UI kit theme but found that tweaking it was an issue, so I'm now using standard-issue Bootstrap.  My question is what or where are recommended/best form UI Components?  I've researched, but am not sure which are quality ones, so recommendations or a guide to resources is appreciated.   I usually use Foundation, and this project is also new to me as it is financial and has dates, amounts, percentages and charts.

I'm using the current Bootstrap version as it is today at https://getbootstrap.com/.

  <!-- Bootstrap CSS -->
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">

  <!-- jQuery first, then Popper.js, then Bootstrap JS -->
  <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
 
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>


UI components of …

Is Jquery outdated? what's the new technology that has replaced JQuery? Is it Bootstrap, Angular or React?

FYI, I don't have enough knowledge on Bootstrap, Angular or Reactjs hence am trying to determine what is the latest that I should be using on newer web applications.

Thanks for the info.

Can someone tell me why the nav bar on this page is not rendering well?  https://www.gopherstateevents.com/results/cc_rslts/cc_rslts.asp?meet_id=617&show_indiv=n&hide_team=n&hide_ind=n&sport=Nordic%20Ski

Thanks!

I am looking for a better way to display the nav bar links starting with "Awards     Bib Look-Up     Results by Team ..."  on https://www.gopherstateevents.com/results/cc_rslts/cc_rslts.asp?meet_id=548&show_indiv=n&hide_team=n&hide_ind=n&sport=Nordic%20Ski

Any ideas would be much appreciated!

Hi Experts,

Bootstrap row is not working in my react application.  Please see the screenshot for reference.

I want two columns in a single row but each column is in each row.  Please help me in resolving this issue.


What I need is col-md-8 and col-md-4 in a single row not one below the other.

Please help me in resolving this issue.

With Many thanks,

Bharath AK

My bootstrap is messed up on https://www.gopherstateevents.com/series/cc_nordic/series_results.asp

Can someone tell me why the data table is spanning the entire page please?

Thank you very much!

socialHandles.push('<div id="editAction'+[i]+'" data-toggle="dropdown" class ="col-lg-3 dropdown-toggle"><div class="file-manager__item file-manager__item--directory card card-small social-hover mb-3"><div class="card-footer"><span class="file-manager__item-icon"><img class="img-responsive img-thumbnail" src="images/icons/fullcontact/' + demo1.infomation.TYPE_ID[i] + '.png"/></span><h6 class="file-manager__item-title">'+demo1.infomation.TYPE_NAME[i]+'</h6></div></div></div><div id="social-action'+[i]+'"  class="dropdown-menu" aria-labelledby="editAction'+[i]+'"> <a class="dropdown-item edit-social-profile" href="#"><i class="fas fa-wrench mr-1"></i>Edit</a><a id='+ demo1.infomation.ID[i] +' class="dropdown-item delete-social-profile" href="#"><i  style = "" class="fas fa-times-circle mr-1"></i>Delete</a></div>');
            }// end for
        }


   
        $("#social-handles").append(socialHandles);

Select all Open in new window

This code is in a for loop from a array.

now it output correctly but the dropdown isnt working correctly,  as yo see i have sperated each dropwon with the number of entires 0, 1 ,2 3 etc,

all seems correct but when i trigger the drop down it keeps opening the first for example

when i click a container with id editActions3 it will open editActions0 dropdown ?

any hints

I have this HTML (based on bootstrap):

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css">

    <title>Backflow Assembly & Test Report Form - Log In</title>
    <style>
        .nopadding {
            padding: 0 !important;
            margin: 0 !important;
        }
        
        .wrapper {
            max-width: 767px;
            min-width: 480px;
            margin: 0 auto;
        }
    </style>
	<script>
	sus = "";
	u = "";
	s = "";
	function chk_vals() {
		if (document.st.uid.value == "" || document.st.pwd.value == "") {
			alert("Please enter Email & Password");
			return false;
		}
		return true;
	}
	$(function() {
            $("#datepickerfr").datepicker();
        });
    $(function() {
            $("#datepickerto").datepicker();
        });
	

Select all Open in new window

…